Fail
Unable to find role="button" and name "320px" Ignored nodes: comments, script, style <div class="css-6yv6gr" data-canvas="bottom" orientation="bottom" > <div class="css-1qonxdy" > <div class="css-1z0q0sr" > <div class="css-1teve26" > <div class="css-kyu95o" > <span> <b> No changes </b> <svg class="css-lht5p2" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M7 14A7 7 0 1 0 7 0a7 7 0 0 0 0 14Zm3.85-9.35c.2.2.2.5 0 .7l-4.5 4.5a.5.5 0 0 1-.7 0l-2.5-2.5a.5.5 0 1 1 .7-.7L6 8.79l4.15-4.14c.2-.2.5-.2.7 0Z" /> </svg> </span> <small> <span> 3 modes , 2 browsers </span> • <span title="Mon, 30 Oct 2023 16:15:07 GMT" > less than a minute ago </span> </small> </div> <div class="css-1cu2l22" > <div class="css-17fv6jh" > <button class="css-ae8uxv" data-testid="button-toggle-snapshot" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M10.65 2.65c.2-.2.5-.2.7 0l1.5 1.5c.2.2.2.5 0 .7l-1.5 1.5a.5.5 0 0 1-.7-.7l.64-.65H1.5a.5.5 0 0 1 0-1h9.8l-.65-.65a.5.5 0 0 1 0-.7ZM3.35 8.35 2.71 9h9.79a.5.5 0 0 1 0 1H2.7l.65.65a.5.5 0 0 1-.7.7l-1.5-1.5a.5.5 0 0 1 0-.7l1.5-1.5a.5.5 0 1 1 .7.7Z" /> </svg> </button> </div> <div class="css-11zsu3t" style="margin-left: 5px; width: 100%;" > <b> Latest </b> Build 1 on feature-branch </div> </div> </div> </div> <div class="css-18xq8qy" > <div class="css-1k4458r" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" src="/ProjectItem-Chrome-320.png" /> </div> </div> <div class="css-9q5ssz" > <div class="css-gsfx4o" > <div class="css-5vam5k" > <div class="css-de1y3s" > <div class="css-c3junj" > <button class="css-ae8uxv" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M4 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM13 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM7 8.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div> Ignored nodes: comments, script, style <div class="css-6yv6gr" data-canvas="bottom" orientation="bottom" > <div class="css-1qonxdy" > <div class="css-1z0q0sr" > <div class="css-1teve26" > <div class="css-kyu95o" > <span> <b> No changes </b> <svg class="css-lht5p2" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M7 14A7 7 0 1 0 7 0a7 7 0 0 0 0 14Zm3.85-9.35c.2.2.2.5 0 .7l-4.5 4.5a.5.5 0 0 1-.7 0l-2.5-2.5a.5.5 0 1 1 .7-.7L6 8.79l4.15-4.14c.2-.2.5-.2.7 0Z" /> </svg> </span> <small> <span> 3 modes , 2 browsers </span> • <span title="Mon, 30 Oct 2023 16:15:07 GMT" > less than a minute ago </span> </small> </div> <div class="css-1cu2l22" > <div class="css-17fv6jh" > <button class="css-ae8uxv" data-testid="button-toggle-snapshot" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M10.65 2.65c.2-.2.5-.2.7 0l1.5 1.5c.2.2.2.5 0 .7l-1.5 1.5a.5.5 0 0 1-.7-.7l.64-.65H1.5a.5.5 0 0 1 0-1h9.8l-.65-.65a.5.5 0 0 1 0-.7ZM3.35 8.35 2.71 9h9.79a.5.5 0 0 1 0 1H2.7l.65.65a.5.5 0 0 1-.7.7l-1.5-1.5a.5.5 0 0 1 0-.7l1.5-1.5a.5.5 0 1 1 .7.7Z" /> </svg> </button> </div> <div class="css-11zsu3t" style="margin-left: 5px; width: 100%;" > <b> Latest </b> Build 1 on feature-branch </div> </div> </div> </div> <div class="css-18xq8qy" > <div class="css-1k4458r" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" src="/ProjectItem-Chrome-320.png" /> </div> </div> <div class="css-9q5ssz" > <div class="css-gsfx4o" > <div class="css-5vam5k" > <div class="css-de1y3s" > <div class="css-c3junj" > <button class="css-ae8uxv" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M4 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM13 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM7 8.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div>View in Storybook
Chrome 105
960x720
Linux Linux Ubuntu 20.04.4
a6013f on ghengeveld/ap-3737-move-switch-snapshot-and-diff-buttons
Unable to find role="button" and name "320px" Ignored nodes: comments, script, style <div class="css-1fcd2ci" data-canvas="bottom" orientation="bottom" > <div class="css-k01oam" > <div class="css-e5jdyv" > <div class="css-1xz1bml" > <div class="css-1o20qqr" > <span> <b> No changes </b> <svg class="css-lht5p2" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M7 14A7 7 0 1 0 7 0a7 7 0 0 0 0 14Zm3.85-9.35c.2.2.2.5 0 .7l-4.5 4.5a.5.5 0 0 1-.7 0l-2.5-2.5a.5.5 0 1 1 .7-.7L6 8.79l4.15-4.14c.2-.2.5-.2.7 0Z" /> </svg> </span> <small> <span> 3 modes , 2 browsers </span> • <span title="Mon, 30 Oct 2023 16:15:07 GMT" > less than a minute ago </span> </small> </div> <div class="css-1cu2l22" > <div class="css-17fv6jh" > <button class="css-1wrd8mw" data-testid="button-toggle-snapshot" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M10.65 2.65c.2-.2.5-.2.7 0l1.5 1.5c.2.2.2.5 0 .7l-1.5 1.5a.5.5 0 0 1-.7-.7l.64-.65H1.5a.5.5 0 0 1 0-1h9.8l-.65-.65a.5.5 0 0 1 0-.7ZM3.35 8.35 2.71 9h9.79a.5.5 0 0 1 0 1H2.7l.65.65a.5.5 0 0 1-.7.7l-1.5-1.5a.5.5 0 0 1 0-.7l1.5-1.5a.5.5 0 1 1 .7.7Z" /> </svg> </button> </div> <div class="css-9bfrsr" style="margin-left: 5px; width: 100%;" > <b> Latest </b> Build 1 on feature-branch </div> </div> </div> </div> <div class="css-18xq8qy" > <div class="css-1k4458r" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" loading="eager" src="/ProjectItem-Chrome-320.png" /> </div> </div> <div class="css-9kgic9" > <div class="css-12hvmrm" > <div class="css-5vam5k" > <div class="css-de1y3s" > <div class="css-c3junj" > <button class="css-1wrd8mw" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M4 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM13 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM7 8.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div> Ignored nodes: comments, script, style <div class="css-1fcd2ci" data-canvas="bottom" orientation="bottom" > <div class="css-k01oam" > <div class="css-e5jdyv" > <div class="css-1xz1bml" > <div class="css-1o20qqr" > <span> <b> No changes </b> <svg class="css-lht5p2" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M7 14A7 7 0 1 0 7 0a7 7 0 0 0 0 14Zm3.85-9.35c.2.2.2.5 0 .7l-4.5 4.5a.5.5 0 0 1-.7 0l-2.5-2.5a.5.5 0 1 1 .7-.7L6 8.79l4.15-4.14c.2-.2.5-.2.7 0Z" /> </svg> </span> <small> <span> 3 modes , 2 browsers </span> • <span title="Mon, 30 Oct 2023 16:15:07 GMT" > less than a minute ago </span> </small> </div> <div class="css-1cu2l22" > <div class="css-17fv6jh" > <button class="css-1wrd8mw" data-testid="button-toggle-snapshot" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M10.65 2.65c.2-.2.5-.2.7 0l1.5 1.5c.2.2.2.5 0 .7l-1.5 1.5a.5.5 0 0 1-.7-.7l.64-.65H1.5a.5.5 0 0 1 0-1h9.8l-.65-.65a.5.5 0 0 1 0-.7ZM3.35 8.35 2.71 9h9.79a.5.5 0 0 1 0 1H2.7l.65.65a.5.5 0 0 1-.7.7l-1.5-1.5a.5.5 0 0 1 0-.7l1.5-1.5a.5.5 0 1 1 .7.7Z" /> </svg> </button> </div> <div class="css-9bfrsr" style="margin-left: 5px; width: 100%;" > <b> Latest </b> Build 1 on feature-branch </div> </div> </div> </div> <div class="css-18xq8qy" > <div class="css-1k4458r" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" loading="eager" src="/ProjectItem-Chrome-320.png" /> </div> </div> <div class="css-9kgic9" > <div class="css-12hvmrm" > <div class="css-5vam5k" > <div class="css-de1y3s" > <div class="css-c3junj" > <button class="css-1wrd8mw" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M4 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM13 7a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0ZM7 8.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> </div>View in Storybook
Chrome 105
960x720
Linux Linux Ubuntu 20.04.4
a6013f on ghengeveld/ap-3737-move-switch-snapshot-and-diff-buttons
Caught exception in
play
functionThis story threw an error after it finished rendering which means interactions may not have been executed fully.
Error: ignoredException at https://6480e1b0042842f149cfd74c-aaibivghde.capture-loopback.chromatic.com/sb-preview/runtime.js:4:93306