Fail
Unable to find role="dialog" Ignored nodes: comments, script, style <div id="storybook-root" > <div class="sc-idXgbr kBfjgZ root" data-font-display="block" id="cube-ui-kit-root" style="--cube-dynamic-viewport-height:900px;" > <button class="sc-eDvSVe fOGegL" data-is-hovered="" data-qa="Button" data-size="medium" data-theme="default" data-type="secondary" type="button" > Click me! </button> <div aria-live="polite" class="sc-ipEyDJ kBRIKt" data-qa="NotificationsBar" role="region" tabindex="0" /> <div class="sc-dmctIk MGDuD" data-is-exited="" data-ismodal="true" data-placement="bottom" data-qa="Popover" role="presentation" style="position: absolute; z-index: 100000;" > <div data-focus-guard="true" style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;" tabindex="-1" /> <div class="sc-fEXmlR iYrOEP" data-focus-lock-disabled="disabled" > <section aria-labelledby="react-aria6512962520-4" class="sc-fnGiBr fXbzEe" data-id="Dialog" data-qa="Dialog" data-size="small" data-type="popover" id="react-aria6512962520-1" role="dialog" style="--dialog-size:360px;" tabindex="-1" > <div style="border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;" > <button aria-label="Dismiss" id="react-aria6512962520-5" tabindex="-1" /> </div> <header class="sc-eDWCr emeahn" data-qa="Header" > <h1 class="sc-dkrFOg dwOwmn" data-level="1" data-qa="Title" id="react-aria6512962520-4" > Modal title </h1> <span class="sc-gswNZR jkWyoV" data-qa="Text" > Header </span> </header> <section class="sc-csuSiG bJRdol" data-qa="Content" > <p class="sc-gswNZR kfnoyX" data-qa="Paragraph" > Test content </p> <p class="sc-gswNZR kfnoyX" data-qa="Paragraph" > Test content </p> </section> <div class="sc-bjfHbI hjFKWd" data-id="Footer" data-qa="Footer" > <div class="sc-hLBbgP kmEYfl" data-qa="ButtonGroup" > <button class="sc-eDvSVe fOGegL" data-qa="Button" data-size="medium" data-theme="default" data-type="primary" type="button" > Action </button> <button class="sc-eDvSVe fOGegL" data-qa="Button" data-size="medium" data-theme="default" data-type="secondary" type="button" > Sec </button> <button class="sc-eDvSVe fOGegL" data-qa="Button" data-size="medium" data-theme="default" data-type="secondary" type="button" > Cancel </button> </div> <span class="sc-gswNZR jkWyoV" data-qa="Text" > Footer </span> </div> </section> </div> <div data-focus-guard="true" style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;" tabindex="-1" /> </div> </div> </div>View in Storybook
Chrome 105
648x470
Linux Linux Ubuntu 20.04.4
8377c6 on react-aria-deps-combined
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://626ee6db91d1c8004a912249-skhbsvfavl.capture-loopback.chromatic.com/sb-preview/runtime.js:4:91104