Fail
Unable to find role="button" and name "Accept test" Ignored nodes: comments, script, style <div class="css-6yv6gr" data-canvas="bottom" orientation="bottom" > <div class="css-1g4yje1" > <div class="css-3fce27" > <div class="css-1qonxdy" > <div class="css-1z0q0sr" > <div class="css-1v57j2" > <div class="css-7izvtm" > <span> <b> 1 change </b> <svg class="css-1y2l1rm" 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.5 6.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1h-7Z" fill-rule="evenodd" /> </svg> </span> <small> <span data-hidden-large="true" > 3 modes , 2 browsers </span> <span data-hidden-large="true" > • </span> <span title="Tue, 14 Nov 2023 22:02:53 GMT" > Ran 2 minutes ago </span> </small> </div> <div class="css-1i3x82u" > <div class="css-11zsu3t" > <b> Latest snapshot </b> </div> </div> <div class="css-1keszfk" > <div class="css-17fv6jh" > <button aria-label="Show baseline snapshot" class="css-1nc8o76" 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> Switch </button> </div> <div class="css-17fv6jh" > <button aria-label="Show spotlight" class="css-1nc8o76" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M0 7a7 7 0 1 1 14 0A7 7 0 0 1 0 7Zm6.5 3.5v2.48A6 6 0 0 1 1.02 7.5H3.5a.5.5 0 0 0 0-1H1.02A6 6 0 0 1 6.5 1.02V3.5a.5.5 0 0 0 1 0V1.02a6 6 0 0 1 5.48 5.48H10.5a.5.5 0 0 0 0 1h2.48a6 6 0 0 1-5.48 5.48V10.5a.5.5 0 0 0-1 0Z" fill-rule="evenodd" /> </svg> </button> </div> <div class="css-17fv6jh" > <button aria-label="Hide diff" class="css-5w2mq0" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M3 3H.5a.5.5 0 0 0-.5.5v10c0 .28.22.5.5.5h10a.5.5 0 0 0 .5-.5V11h2.5a.5.5 0 0 0 .5-.5V.5a.5.5 0 0 0-.5-.5h-10a.5.5 0 0 0-.5.5V3Zm1 1v2.3L6.3 4H4ZM3 4v6.5a.5.5 0 0 0 .5.5H10v2H1V4h2Zm1-1h6.5a.5.5 0 0 1 .5.5V10h2V1H4v2Zm6 7V7.71l-2.3 2.3H10Zm0-3.7V4.7L4.7 10h1.6L10 6.3ZM9.3 4H7.7L4 7.71V9.3L9.3 4Z" fill-rule="evenodd" /> </svg> </button> </div> </div> <div class="css-17t67ho" > <div> <div class="css-17fv6jh" > <button aria-label="Accept story" class="css-1qjw91m" type="button" > Accept </button> </div> <div class="css-17fv6jh" > <div class="css-c3junj" > <button aria-label="Batch accept" class="css-188572m" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M11.5 2a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Zm-2.2.6a.5.5 0 0 1 .1.7l-5.995 7.993a.505.505 0 0 1-.37.206.5.5 0 0 1-.395-.152L.146 8.854a.5.5 0 1 1 .708-.708l2.092 2.093L8.6 2.7a.5.5 0 0 1 .7-.1ZM11 7a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2A.5.5 0 0 1 11 7Zm.5 4a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> <div class="css-18xq8qy" > <a class="css-1fy1yvr" href="https://www.chromatic.com/test?appId=123&id=10" target="_blank" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" src="/B.png" style="opacity: 0.7;" /> <img alt="" src="/B-comparison.png" style="max-width: 100%;" /> <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M2 1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V7.5a.5.5 0 0 0-1 0V12H2V2h4.5a.5.5 0 0 0 0-1H2Z" /> <path d="M7.35 7.36 12 2.7v1.8a.5.5 0 0 0 1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 1 0 0 1h1.8L6.64 6.64a.5.5 0 1 0 .7.7Z" /> </svg> </a> </div> <div class="css-9q5ssz" > <div class="css-gsfx4o" > <d... Ignored nodes: comments, script, style <div class="css-6yv6gr" data-canvas="bottom" orientation="bottom" > <div class="css-1g4yje1" > <div class="css-3fce27" > <div class="css-1qonxdy" > <div class="css-1z0q0sr" > <div class="css-1v57j2" > <div class="css-7izvtm" > <span> <b> 1 change </b> <svg class="css-1y2l1rm" 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.5 6.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1h-7Z" fill-rule="evenodd" /> </svg> </span> <small> <span data-hidden-large="true" > 3 modes , 2 browsers </span> <span data-hidden-large="true" > • </span> <span title="Tue, 14 Nov 2023 22:02:53 GMT" > Ran 2 minutes ago </span> </small> </div> <div class="css-1i3x82u" > <div class="css-11zsu3t" > <b> Latest snapshot </b> </div> </div> <div class="css-1keszfk" > <div class="css-17fv6jh" > <button aria-label="Show baseline snapshot" class="css-1nc8o76" 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> Switch </button> </div> <div class="css-17fv6jh" > <button aria-label="Show spotlight" class="css-1nc8o76" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M0 7a7 7 0 1 1 14 0A7 7 0 0 1 0 7Zm6.5 3.5v2.48A6 6 0 0 1 1.02 7.5H3.5a.5.5 0 0 0 0-1H1.02A6 6 0 0 1 6.5 1.02V3.5a.5.5 0 0 0 1 0V1.02a6 6 0 0 1 5.48 5.48H10.5a.5.5 0 0 0 0 1h2.48a6 6 0 0 1-5.48 5.48V10.5a.5.5 0 0 0-1 0Z" fill-rule="evenodd" /> </svg> </button> </div> <div class="css-17fv6jh" > <button aria-label="Hide diff" class="css-5w2mq0" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M3 3H.5a.5.5 0 0 0-.5.5v10c0 .28.22.5.5.5h10a.5.5 0 0 0 .5-.5V11h2.5a.5.5 0 0 0 .5-.5V.5a.5.5 0 0 0-.5-.5h-10a.5.5 0 0 0-.5.5V3Zm1 1v2.3L6.3 4H4ZM3 4v6.5a.5.5 0 0 0 .5.5H10v2H1V4h2Zm1-1h6.5a.5.5 0 0 1 .5.5V10h2V1H4v2Zm6 7V7.71l-2.3 2.3H10Zm0-3.7V4.7L4.7 10h1.6L10 6.3ZM9.3 4H7.7L4 7.71V9.3L9.3 4Z" fill-rule="evenodd" /> </svg> </button> </div> </div> <div class="css-17t67ho" > <div> <div class="css-17fv6jh" > <button aria-label="Accept story" class="css-1qjw91m" type="button" > Accept </button> </div> <div class="css-17fv6jh" > <div class="css-c3junj" > <button aria-label="Batch accept" class="css-188572m" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M11.5 2a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Zm-2.2.6a.5.5 0 0 1 .1.7l-5.995 7.993a.505.505 0 0 1-.37.206.5.5 0 0 1-.395-.152L.146 8.854a.5.5 0 1 1 .708-.708l2.092 2.093L8.6 2.7a.5.5 0 0 1 .7-.1ZM11 7a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2A.5.5 0 0 1 11 7Zm.5 4a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> <div class="css-18xq8qy" > <a class="css-1fy1yvr" href="https://www.chromatic.com/test?appId=123&id=10" target="_blank" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" src="/B.png" style="opacity: 0.7;" /> <img alt="" src="/B-comparison.png" style="max-width: 100%;" /> <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M2 1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V7.5a.5.5 0 0 0-1 0V12H2V2h4.5a.5.5 0 0 0 0-1H2Z" /> <path d="M7.35 7.36 12 2.7v1.8a.5.5 0 0 0 1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 1 0 0 1h1.8L6.64 6.64a.5.5 0 1 0 .7.7Z" /> </svg> </a> </div> <div class="css-9q5ssz" > <div class="css-gsfx4o" > <d...View in Storybook
Chrome 105
960x720
Linux Linux Ubuntu 20.04.4
e7811f on ghengeveld/ap-3737-move-switch-snapshot-and-diff-buttons
Unable to find role="button" and name "Accept test" Ignored nodes: comments, script, style <div class="css-1fcd2ci" data-canvas="bottom" orientation="bottom" > <div class="css-1g4yje1" > <div class="css-1sox8p1" > <div class="css-k01oam" > <div class="css-e5jdyv" > <div class="css-17e9o1a" > <div class="css-ym6a5r" > <span> <b> 1 change </b> <svg class="css-1y2l1rm" 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.5 6.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1h-7Z" fill-rule="evenodd" /> </svg> </span> <small> <span data-hidden-large="true" > 3 modes , 2 browsers </span> <span data-hidden-large="true" > • </span> <span title="Tue, 14 Nov 2023 22:02:53 GMT" > Ran 2 minutes ago </span> </small> </div> <div class="css-1i3x82u" > <div class="css-9bfrsr" > <b> Latest snapshot </b> </div> </div> <div class="css-1keszfk" > <div class="css-17fv6jh" > <button aria-label="Show baseline snapshot" class="css-1uhf3xi" 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> Switch </button> </div> <div class="css-17fv6jh" > <button aria-label="Show spotlight" class="css-1uhf3xi" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M0 7a7 7 0 1 1 14 0A7 7 0 0 1 0 7Zm6.5 3.5v2.48A6 6 0 0 1 1.02 7.5H3.5a.5.5 0 0 0 0-1H1.02A6 6 0 0 1 6.5 1.02V3.5a.5.5 0 0 0 1 0V1.02a6 6 0 0 1 5.48 5.48H10.5a.5.5 0 0 0 0 1h2.48a6 6 0 0 1-5.48 5.48V10.5a.5.5 0 0 0-1 0Z" fill-rule="evenodd" /> </svg> </button> </div> <div class="css-17fv6jh" > <button aria-label="Hide diff" class="css-w6etqe" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M3 3H.5a.5.5 0 0 0-.5.5v10c0 .28.22.5.5.5h10a.5.5 0 0 0 .5-.5V11h2.5a.5.5 0 0 0 .5-.5V.5a.5.5 0 0 0-.5-.5h-10a.5.5 0 0 0-.5.5V3Zm1 1v2.3L6.3 4H4ZM3 4v6.5a.5.5 0 0 0 .5.5H10v2H1V4h2Zm1-1h6.5a.5.5 0 0 1 .5.5V10h2V1H4v2Zm6 7V7.71l-2.3 2.3H10Zm0-3.7V4.7L4.7 10h1.6L10 6.3ZM9.3 4H7.7L4 7.71V9.3L9.3 4Z" fill-rule="evenodd" /> </svg> </button> </div> </div> <div class="css-nrne5d" > <div> <div class="css-17fv6jh" > <button aria-label="Accept story" class="css-1py7xju" type="button" > Accept </button> </div> <div class="css-17fv6jh" > <div class="css-c3junj" > <button aria-label="Batch accept" class="css-etgoop" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M11.5 2a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Zm-2.2.6a.5.5 0 0 1 .1.7l-5.995 7.993a.505.505 0 0 1-.37.206.5.5 0 0 1-.395-.152L.146 8.854a.5.5 0 1 1 .708-.708l2.092 2.093L8.6 2.7a.5.5 0 0 1 .7-.1ZM11 7a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2A.5.5 0 0 1 11 7Zm.5 4a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> <div class="css-18xq8qy" > <a class="css-1fy1yvr" href="https://www.chromatic.com/test?appId=123&id=10" target="_blank" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" loading="eager" src="/B.png" style="opacity: 0.7;" /> <img alt="" loading="eager" src="/B-comparison.png" style="max-width: 100%;" /> <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M2 1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V7.5a.5.5 0 0 0-1 0V12H2V2h4.5a.5.5 0 0 0 0-1H2Z" /> <path d="M7.35 7.36 12 2.7v1.8a.5.5 0 0 0 1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 1 0 0 1h1.8L6.64 6.64a.5.5 0 1 0 .7.7Z" /> </svg> </a> </div> <div class="css-9kgic9" > <div... Ignored nodes: comments, script, style <div class="css-1fcd2ci" data-canvas="bottom" orientation="bottom" > <div class="css-1g4yje1" > <div class="css-1sox8p1" > <div class="css-k01oam" > <div class="css-e5jdyv" > <div class="css-17e9o1a" > <div class="css-ym6a5r" > <span> <b> 1 change </b> <svg class="css-1y2l1rm" 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.5 6.5a.5.5 0 0 0 0 1h7a.5.5 0 0 0 0-1h-7Z" fill-rule="evenodd" /> </svg> </span> <small> <span data-hidden-large="true" > 3 modes , 2 browsers </span> <span data-hidden-large="true" > • </span> <span title="Tue, 14 Nov 2023 22:02:53 GMT" > Ran 2 minutes ago </span> </small> </div> <div class="css-1i3x82u" > <div class="css-9bfrsr" > <b> Latest snapshot </b> </div> </div> <div class="css-1keszfk" > <div class="css-17fv6jh" > <button aria-label="Show baseline snapshot" class="css-1uhf3xi" 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> Switch </button> </div> <div class="css-17fv6jh" > <button aria-label="Show spotlight" class="css-1uhf3xi" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M0 7a7 7 0 1 1 14 0A7 7 0 0 1 0 7Zm6.5 3.5v2.48A6 6 0 0 1 1.02 7.5H3.5a.5.5 0 0 0 0-1H1.02A6 6 0 0 1 6.5 1.02V3.5a.5.5 0 0 0 1 0V1.02a6 6 0 0 1 5.48 5.48H10.5a.5.5 0 0 0 0 1h2.48a6 6 0 0 1-5.48 5.48V10.5a.5.5 0 0 0-1 0Z" fill-rule="evenodd" /> </svg> </button> </div> <div class="css-17fv6jh" > <button aria-label="Hide diff" class="css-w6etqe" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M3 3H.5a.5.5 0 0 0-.5.5v10c0 .28.22.5.5.5h10a.5.5 0 0 0 .5-.5V11h2.5a.5.5 0 0 0 .5-.5V.5a.5.5 0 0 0-.5-.5h-10a.5.5 0 0 0-.5.5V3Zm1 1v2.3L6.3 4H4ZM3 4v6.5a.5.5 0 0 0 .5.5H10v2H1V4h2Zm1-1h6.5a.5.5 0 0 1 .5.5V10h2V1H4v2Zm6 7V7.71l-2.3 2.3H10Zm0-3.7V4.7L4.7 10h1.6L10 6.3ZM9.3 4H7.7L4 7.71V9.3L9.3 4Z" fill-rule="evenodd" /> </svg> </button> </div> </div> <div class="css-nrne5d" > <div> <div class="css-17fv6jh" > <button aria-label="Accept story" class="css-1py7xju" type="button" > Accept </button> </div> <div class="css-17fv6jh" > <div class="css-c3junj" > <button aria-label="Batch accept" class="css-etgoop" type="button" > <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M11.5 2a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Zm-2.2.6a.5.5 0 0 1 .1.7l-5.995 7.993a.505.505 0 0 1-.37.206.5.5 0 0 1-.395-.152L.146 8.854a.5.5 0 1 1 .708-.708l2.092 2.093L8.6 2.7a.5.5 0 0 1 .7-.1ZM11 7a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2A.5.5 0 0 1 11 7Zm.5 4a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2Z" /> </svg> </button> </div> </div> </div> </div> </div> </div> <div class="css-18xq8qy" > <a class="css-1fy1yvr" href="https://www.chromatic.com/test?appId=123&id=10" target="_blank" > <img alt="Snapshot for the 'Primary' story of the 'Button' component" loading="eager" src="/B.png" style="opacity: 0.7;" /> <img alt="" loading="eager" src="/B-comparison.png" style="max-width: 100%;" /> <svg class="css-149xqrd" height="14px" viewBox="0 0 14 14" width="14px" > <path d="M2 1a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V7.5a.5.5 0 0 0-1 0V12H2V2h4.5a.5.5 0 0 0 0-1H2Z" /> <path d="M7.35 7.36 12 2.7v1.8a.5.5 0 0 0 1 0v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 1 0 0 1h1.8L6.64 6.64a.5.5 0 1 0 .7.7Z" /> </svg> </a> </div> <div class="css-9kgic9" > <div...View in Storybook
Chrome 105
960x720
Linux Linux Ubuntu 20.04.4
e7811f 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-vzbmsdhvmo.capture-loopback.chromatic.com/sb-preview/runtime.js:4:93306