Menu:Inside Modal

Build 1073 on react-aria-deps-combined
1200px
Reviewing disabled
View latest build
ErrorBuild 1073 on react-aria-deps-combined
View Storybook
ErrorBuild 1073 on react-aria-deps-combined
View Storybook
  • Discussions
  • Interactions
Fail
Menu.stories.tsx
Unable to find an element by: [data-qa="ContextMenuList"]

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;"
  >
    <div
      aria-live="polite"
      class="sc-ipEyDJ kBRIKt"
      data-qa="NotificationsBar"
      role="region"
      tabindex="0"
    />
    <div
      class="sc-bqWxrE mTbfW"
      data-is-open=""
      data-qa="Underlay"
    />
    <div
      class="sc-ksBlkl lhPMdW"
      data-qa="ModalWrapper"
      data-type="modal"
    >
      <div
        class="sc-hBxehG jnTqGz"
        data-is-entered=""
        data-is-open=""
        data-ismodal="true"
        data-qa="Modal"
        data-type="modal"
      >
        <div
          data-focus-guard="true"
          style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
          tabindex="0"
        />
        <div
          class="sc-fEXmlR iYrOEP"
          data-focus-lock-disabled="false"
        >
          <section
            class="sc-fnGiBr fXbzEe"
            data-id="Dialog"
            data-qa="Dialog"
            data-size="small"
            data-type="modal"
            role="alertdialog"
            style="--dialog-size:360px;"
            tabindex="-1"
          >
            <section
              class="sc-csuSiG bJRdol"
              data-qa="Content"
            >
              <button
                aria-label="Open Context Menu"
                class="sc-eDvSVe fOGegL"
                data-is-hovered=""
                data-is-single-icon-only=""
                data-qa="ContextMenuButton"
                data-size="small"
                data-theme="default"
                data-type="secondary"
                type="button"
              >
                <span
                  aria-label="more"
                  class="anticon anticon-more"
                  data-element="ButtonIcon"
                  role="img"
                >
                  <svg
                    aria-hidden="true"
                    data-icon="more"
                    fill="currentColor"
                    focusable="false"
                    height="1em"
                    viewBox="64 64 896 896"
                    width="1em"
                  >
                    <path
                      d="M456 231a56 56 0 10112 0 56 56 0 10-112 0zm0 280a56 56 0 10112 0 56 56 0 10-112 0zm0 280a56 56 0 10112 0 56 56 0 10-112 0z"
                    />
                  </svg>
                </span>
              </button>
            </section>
            <div
              class="sc-bjfHbI hjFKWd"
              data-id="Footer"
              data-qa="Footer"
            >
              <div
                class="sc-hLBbgP kpjtdA"
                data-qa="ButtonGroup"
              >
                <button
                  aria-label="Ok"
                  class="sc-eDvSVe fOGegL"
                  data-qa="Button"
                  data-size="medium"
                  data-theme="default"
                  data-type="primary"
                  type="button"
                >
                  Ok
                </button>
              </div>
            </div>
          </section>
        </div>
        <div
          data-focus-guard="true"
          style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
          tabindex="0"
        />
      </div>
    </div>
  </div>
</div>

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;"
  >
    <div
      aria-live="polite"
      class="sc-ipEyDJ kBRIKt"
      data-qa="NotificationsBar"
      role="region"
      tabindex="0"
    />
    <div
      class="sc-bqWxrE mTbfW"
      data-is-open=""
      data-qa="Underlay"
    />
    <div
      class="sc-ksBlkl lhPMdW"
      data-qa="ModalWrapper"
      data-type="modal"
    >
      <div
        class="sc-hBxehG jnTqGz"
        data-is-entered=""
        data-is-open=""
        data-ismodal="true"
        data-qa="Modal"
        data-type="modal"
      >
        <div
          data-focus-guard="true"
          style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
          tabindex="0"
        />
        <div
          class="sc-fEXmlR iYrOEP"
          data-focus-lock-disabled="false"
        >
          <section
            class="sc-fnGiBr fXbzEe"
            data-id="Dialog"
            data-qa="Dialog"
            data-size="small"
            data-type="modal"
            role="alertdialog"
            style="--dialog-size:360px;"
            tabindex="-1"
          >
            <section
              class="sc-csuSiG bJRdol"
              data-qa="Content"
            >
              <button
                aria-label="Open Context Menu"
                class="sc-eDvSVe fOGegL"
                data-is-hovered=""
                data-is-single-icon-only=""
                data-qa="ContextMenuButton"
                data-size="small"
                data-theme="default"
                data-type="secondary"
                type="button"
              >
                <span
                  aria-label="more"
                  class="anticon anticon-more"
                  data-element="ButtonIcon"
                  role="img"
                >
                  <svg
                    aria-hidden="true"
                    data-icon="more"
                    fill="currentColor"
                    focusable="false"
                    height="1em"
                    viewBox="64 64 896 896"
                    width="1em"
                  >
                    <path
                      d="M456 231a56 56 0 10112 0 56 56 0 10-112 0zm0 280a56 56 0 10112 0 56 56 0 10-112 0zm0 280a56 56 0 10112 0 56 56 0 10-112 0z"
                    />
                  </svg>
                </span>
              </button>
            </section>
            <div
              class="sc-bjfHbI hjFKWd"
              data-id="Footer"
              data-qa="Footer"
            >
              <div
                class="sc-hLBbgP kpjtdA"
                data-qa="ButtonGroup"
              >
                <button
                  aria-label="Ok"
                  class="sc-eDvSVe fOGegL"
                  data-qa="Button"
                  data-size="medium"
                  data-theme="default"
                  data-type="primary"
                  type="button"
                >
                  Ok
                </button>
              </div>
            </div>
          </section>
        </div>
        <div
          data-focus-guard="true"
          style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
          tabindex="0"
        />
      </div>
    </div>
  </div>
</div>
View in Storybook
Chrome 105
1200x900
Linux Linux Ubuntu 20.04.4
8377c6 on react-aria-deps-combined
Caught exception in play function

This 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