TestingModule:Cancelling

Build 15701 on testing-module-settings
1200px
Reviewing disabled
View latest build
chromechrome
Build 15701 on testing-module-settings
View Storybook
ErrorBuild 15701 on testing-module-settings
View Storybook
The baseline is larger than the new snapshot (1200x900 to 232x214).
edgeedge
The baseline is larger than the new snapshot (1200x900 to 232x214).
firefoxfirefox
The baseline is larger than the new snapshot (1200x900 to 232x214).
Fail
TestingModule.stories.tsx
Unable to find role="button" and name `/Expand/`

Ignored nodes: comments, script, style
<div
  id="storybook-root"
>
  <div
    style="max-width: 232px;"
  >
    <div
      class="css-keuk95"
      id="storybook-testing-module"
    >
      <div
        class="css-1u2j0qv"
      >
        <div
          class="css-1d56hfi"
          data-testid="collapse"
          style="transition: max-height 0ms ease 0s; display: block; max-height: 172px;"
        >
          <div
            class="css-j7qwjs"
          >
            <div
              class="css-1e3qj69"
              data-module-id="component-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Component tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Ran 2 seconds ago
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Enable watch mode for "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M7 9.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5z"
                        fill="currentColor"
                      />
                      <path
                        clip-rule="evenodd"
                        d="M14 7l-.21.293C13.669 7.465 10.739 11.5 7 11.5S.332 7.465.21 7.293L0 7l.21-.293C.331 6.536 3.261 2.5 7 2.5s6.668 4.036 6.79 4.207L14 7zM2.896 5.302A12.725 12.725 0 001.245 7c.296.37.874 1.04 1.65 1.698C4.043 9.67 5.482 10.5 7 10.5c1.518 0 2.958-.83 4.104-1.802A12.72 12.72 0 0012.755 7c-.297-.37-.875-1.04-1.65-1.698C9.957 4.33 8.517 3.5 7 3.5c-1.519 0-2.958.83-4.104 1.802z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                  <button
                    aria-label="Stop "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M2.2 2.204v9.6h9.6v-9.6H2.2zm-.7-1.2a.5.5 0 00-.5.5v11a.5.5 0 00.5.5h11a.5.5 0 00.5-.5v-11a.5.5 0 00-.5-.5h-11z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="visual-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Visual tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Not run
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Start Visual tests"
                    class="css-18rvurk"
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M4.2 10.88L10.668 7 4.2 3.12v7.76zM3 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L4.212 1.727A.8.8 0 003 2.413z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="linting"
            >
              <div
                class="css-149qlay"
              >
                Custom render function
              </div>
            </div>
          </div>
        </div>
        <div
          class="css-poqyku"
        >
          <button
            class="css-xv66sf"
            disabled=""
          >
            <svg
              fill="none"
              height="14"
              viewBox="0 0 14 14"
              width="14"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M5.2 10.88L11.668 7 5.2 3.12v7.76zM4 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L5.212 1.727A.8.8 0 004 2.413zM1.5 1.6a.6.6 0 01.6.6v9.6a.6.6 0 11-1.2 0V2.2a.6.6 0 01.6-.6z"
                fill="currentColor"
                fill-rule="evenodd"
              />
              <path
                clip-rule="evenodd"
                d="M.963 1.932a.6.6 0 01.805-.268l1 .5a.6.6 0 01-.536 1.073l-1-.5a.6.6 0 01-.269-.805zM3.037 11.132a.6.6 0 01-.269.805l-1 .5a.6.6 0 01-.536-1.073l1-.5a.6.6 0 01.805.268z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            Running...
          </button>
          <div
            class="css-13pthy0"
          >
            <button
              aria-label="Collapse testing module"
              class="css-jci5v"
              id="testing-module-collapse-toggle"
            >
              <svg
                fill="none"
                height="14"
                style="transform: rotate(180deg); transition: transform 250ms ease 0s; will-change: auto;"
                viewBox="0 0 14 14"
                width="14"
                xmlns="http://www.w3.org/2000/svg"
              >
                <path
                  d="M3.854 9.104a.5.5 0 11-.708-.708l3.5-3.5a.5.5 0 01.708 0l3.5 3.5a.5.5 0 01-.708.708L7 5.957 3.854 9.104z"
                  fill="currentColor"
                />
              </svg>
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Ignored nodes: comments, script, style
<div
  id="storybook-root"
>
  <div
    style="max-width: 232px;"
  >
    <div
      class="css-keuk95"
      id="storybook-testing-module"
    >
      <div
        class="css-1u2j0qv"
      >
        <div
          class="css-1d56hfi"
          data-testid="collapse"
          style="transition: max-height 0ms ease 0s; display: block; max-height: 172px;"
        >
          <div
            class="css-j7qwjs"
          >
            <div
              class="css-1e3qj69"
              data-module-id="component-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Component tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Ran 2 seconds ago
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Enable watch mode for "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M7 9.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5z"
                        fill="currentColor"
                      />
                      <path
                        clip-rule="evenodd"
                        d="M14 7l-.21.293C13.669 7.465 10.739 11.5 7 11.5S.332 7.465.21 7.293L0 7l.21-.293C.331 6.536 3.261 2.5 7 2.5s6.668 4.036 6.79 4.207L14 7zM2.896 5.302A12.725 12.725 0 001.245 7c.296.37.874 1.04 1.65 1.698C4.043 9.67 5.482 10.5 7 10.5c1.518 0 2.958-.83 4.104-1.802A12.72 12.72 0 0012.755 7c-.297-.37-.875-1.04-1.65-1.698C9.957 4.33 8.517 3.5 7 3.5c-1.519 0-2.958.83-4.104 1.802z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                  <button
                    aria-label="Stop "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M2.2 2.204v9.6h9.6v-9.6H2.2zm-.7-1.2a.5.5 0 00-.5.5v11a.5.5 0 00.5.5h11a.5.5 0 00.5-.5v-11a.5.5 0 00-.5-.5h-11z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="visual-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Visual tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Not run
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Start Visual tests"
                    class="css-18rvurk"
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M4.2 10.88L10.668 7 4.2 3.12v7.76zM3 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L4.212 1.727A.8.8 0 003 2.413z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="linting"
            >
              <div
                class="css-149qlay"
              >
                Custom render function
              </div>
            </div>
          </div>
        </div>
        <div
          class="css-poqyku"
        >
          <button
            class="css-xv66sf"
            disabled=""
          >
            <svg
              fill="none"
              height="14"
              viewBox="0 0 14 14"
              width="14"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M5.2 10.88L11.668 7 5.2 3.12v7.76zM4 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L5.212 1.727A.8.8 0 004 2.413zM1.5 1.6a.6.6 0 01.6.6v9.6a.6.6 0 11-1.2 0V2.2a.6.6 0 01.6-.6z"
                fill="currentColor"
                fill-rule="evenodd"
              />
              <path
                clip-rule="evenodd"
                d="M.963 1.932a.6.6 0 01.805-.268l1 .5a.6.6 0 01-.536 1.073l-1-.5a.6.6 0 01-.269-.805zM3.037 11.132a.6.6 0 01-.269.805l-1 .5a.6.6 0 01-.536-1.073l1-.5a.6.6 0 01.805.268z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            Running...
          </button>
          <div
            class="css-13pthy0"
          >
            <button
              aria-label="Collapse testing module"
              class="css-jci5v"
              id="testing-module-collapse-toggle"
            >
              <svg
                fill="none"
                height="14"
                style="transform: rotate(180deg); transition: transform 250ms ease 0s; will-change: auto;"
                viewBox="0 0 14 14"
                width="14"
                xmlns="http://www.w3.org/2000/svg"
              >
                <path
                  d="M3.854 9.104a.5.5 0 11-.708-.708l3.5-3.5a.5.5 0 01.708 0l3.5 3.5a.5.5 0 01-.708.708L7 5.957 3.854 9.104z"
                  fill="currentColor"
                />
              </svg>
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
View in Storybook
Chrome 121
232x214
Linux Linux Ubuntu 20.04.4
73e55e on testing-module-settings
Caught exception in play function

This story threw an error after it finished rendering which means interactions may not have been executed fully.

Error: Unable to find role="button" and name `/Expand/`

Ignored nodes: comments, script, style
<div
  id="storybook-root"
>
  <div
    style="max-width: 232px;"
  >
    <div
      class="css-keuk95"
      id="storybook-testing-module"
    >
      <div
        class="css-1u2j0qv"
      >
        <div
          class="css-1d56hfi"
          data-testid="collapse"
          style="transition: max-height 0ms ease 0s; display: block; max-height: 172px;"
        >
          <div
            class="css-j7qwjs"
          >
            <div
              class="css-1e3qj69"
              data-module-id="component-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Component tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Ran 2 seconds ago
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Enable watch mode for "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M7 9.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5z"
                        fill="currentColor"
                      />
                      <path
                        clip-rule="evenodd"
                        d="M14 7l-.21.293C13.669 7.465 10.739 11.5 7 11.5S.332 7.465.21 7.293L0 7l.21-.293C.331 6.536 3.261 2.5 7 2.5s6.668 4.036 6.79 4.207L14 7zM2.896 5.302A12.725 12.725 0 001.245 7c.296.37.874 1.04 1.65 1.698C4.043 9.67 5.482 10.5 7 10.5c1.518 0 2.958-.83 4.104-1.802A12.72 12.72 0 0012.755 7c-.297-.37-.875-1.04-1.65-1.698C9.957 4.33 8.517 3.5 7 3.5c-1.519 0-2.958.83-4.104 1.802z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                  <button
                    aria-label="Stop "
                    class="css-xv66sf"
                    disabled=""
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M2.2 2.204v9.6h9.6v-9.6H2.2zm-.7-1.2a.5.5 0 00-.5.5v11a.5.5 0 00.5.5h11a.5.5 0 00.5-.5v-11a.5.5 0 00-.5-.5h-11z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="visual-tests"
            >
              <div
                class="css-j4dgzn"
              >
                <div
                  class="css-1g0drmq"
                >
                  <div
                    class="css-gi18t0"
                    id="testing-module-title"
                  >
                    Visual tests
                  </div>
                  <div
                    class="css-6c3wwi"
                    id="testing-module-description"
                  >
                    Not run
                  </div>
                </div>
                <div
                  class="css-ffmerx"
                >
                  <button
                    aria-label="Start Visual tests"
                    class="css-18rvurk"
                  >
                    <svg
                      fill="none"
                      height="14"
                      viewBox="0 0 14 14"
                      width="14"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        clip-rule="evenodd"
                        d="M4.2 10.88L10.668 7 4.2 3.12v7.76zM3 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L4.212 1.727A.8.8 0 003 2.413z"
                        fill="currentColor"
                        fill-rule="evenodd"
                      />
                    </svg>
                  </button>
                </div>
              </div>
            </div>
            <div
              class="css-1e3qj69"
              data-module-id="linting"
            >
              <div
                class="css-149qlay"
              >
                Custom render function
              </div>
            </div>
          </div>
        </div>
        <div
          class="css-poqyku"
        >
          <button
            class="css-xv66sf"
            disabled=""
          >
            <svg
              fill="none"
              height="14"
              viewBox="0 0 14 14"
              width="14"
              xmlns="http://www.w3.org/2000/svg"
            >
              <path
                clip-rule="evenodd"
                d="M5.2 10.88L11.668 7 5.2 3.12v7.76zM4 2.414v9.174a.8.8 0 001.212.686l7.645-4.587a.8.8 0 000-1.372L5.212 1.727A.8.8 0 004 2.413zM1.5 1.6a.6.6 0 01.6.6v9.6a.6.6 0 11-1.2 0V2.2a.6.6 0 01.6-.6z"
                fill="currentColor"
                fill-rule="evenodd"
              />
              <path
                clip-rule="evenodd"
                d="M.963 1.932a.6.6 0 01.805-.268l1 .5a.6.6 0 01-.536 1.073l-1-.5a.6.6 0 01-.269-.805zM3.037 11.132a.6.6 0 01-.269.805l-1 .5a.6.6 0 01-.536-1.073l1-.5a.6.6 0 01.805.268z"
                fill="currentColor"
                fill-rule="evenodd"
              />
            </svg>
            Running...
          </button>
          <div
            class="css-13pthy0"
          >
            <button
              aria-label="Collapse testing module"
              class="css-jci5v"
              id="testing-module-collapse-toggle"
            >
              <svg
                fill="none"
                height="14"
                style="transform: rotate(180deg); transition: transform 250ms ease 0s; will-change: auto;"
                viewBox="0 0 14 14"
                width="14"
                xmlns="http://www.w3.org/2000/svg"
              >
                <path
                  d="M3.854 9.104a.5.5 0 11-.708-.708l3.5-3.5a.5.5 0 01.708 0l3.5 3.5a.5.5 0 01-.708.708L7 5.957 3.854 9.104z"
                  fill="currentColor"
                />
              </svg>
            </button>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
    at ka (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-ee31b4a8.js:151:3353)
    at https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-ee31b4a8.js:159:234
    at Rl.invoke (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-28297db0.js:48:8791)
    at Rl.intercept (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-28297db0.js:48:6193)
    at Rl.track (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-28297db0.js:48:5925)
    at Object.findByRole (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/index-28297db0.js:48:5198)
    at play (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/assets/TestingModule.stories-9e2d073c.js:1:1870)
    at https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/sb-preview/runtime.js:5988:60
    at mn.runPhase (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/sb-preview/runtime.js:5875:100)
    at mn.render (https://635781f3500dd2c49e189caf-ffknmcyxlm.capture-loopback.chromatic.com/sb-preview/runtime.js:5988:25)