Skip to content

SlotFill: use observableMap everywhere, remove manual rerendering #120581

SlotFill: use observableMap everywhere, remove manual rerendering

SlotFill: use observableMap everywhere, remove manual rerendering #120581

Triggered via pull request November 28, 2024 15:47
Status Failure
Total duration 7m 40s
Artifacts 1

unit-test.yml

on: pull_request
Compute previous WordPress version
0s
Compute previous WordPress version
Build JavaScript assets for PHP unit tests
4m 18s
Build JavaScript assets for PHP unit tests
PHP coding standards
17s
PHP coding standards
Matrix: unit-js-date
Matrix: unit-js
Matrix: test-php
Fit to window
Zoom out
Zoom in

Annotations

15 errors and 10 warnings
JavaScript (Node.js 22) 4/4: packages/components/src/slot-fill/test/slot.js#L168
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should re-render Slot when not bubbling virtually 2` - Snapshot - 3 + Received + 1 <div> - <div> - 2 - </div> + <div /> <button type="button" /> </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:168:23)
JavaScript (Node.js 22) 4/4: packages/components/src/slot-fill/test/slot.js#L229
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should render in expected order when fills always mounted 1` - Snapshot - 6 + Received + 1 <div> - <div> - first (rerendered) - second - third - fourth (new) - </div> + <div /> </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:229:23) at Promise.then.completed (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:300:28) at new Promise (<anonymous>) at callAsyncCircusFn (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:233:10) at _callCircusTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:315:40) at _runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:251:3) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:125:9) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:120:9) at run (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:70:3) at runAndTransformResultsToJestFormat (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:122:21) at jestAdapter (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:79:19) at runTestInternal (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:367:16) at runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:444:34) at Object.worker (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/testWorker.js:106:12)
JavaScript (Node.js 22) 4/4: packages/components/src/slot-fill/test/slot.js#L273
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should render in expected order when fills unmounted 1` - Snapshot - 0 + Received + 1 @@ -1,7 +1,8 @@ <div> <div> + first second third first (rerendered) fourth (new) </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:273:23) at Promise.then.completed (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:300:28) at new Promise (<anonymous>) at callAsyncCircusFn (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:233:10) at _callCircusTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:315:40) at _runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:251:3) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:125:9) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:120:9) at run (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:70:3) at runAndTransformResultsToJestFormat (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:122:21) at jestAdapter (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:79:19) at runTestInternal (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:367:16) at runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:444:34) at Object.worker (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/testWorker.js:106:12)
JavaScript (Node.js 22) 4/4
Process completed with exit code 1.
JavaScript (Node.js 20) 4/4: packages/components/src/slot-fill/test/slot.js#L168
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should re-render Slot when not bubbling virtually 2` - Snapshot - 3 + Received + 1 <div> - <div> - 2 - </div> + <div /> <button type="button" /> </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:168:23)
JavaScript (Node.js 20) 4/4: packages/components/src/slot-fill/test/slot.js#L229
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should render in expected order when fills always mounted 1` - Snapshot - 6 + Received + 1 <div> - <div> - first (rerendered) - second - third - fourth (new) - </div> + <div /> </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:229:23) at Promise.then.completed (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:300:28) at new Promise (<anonymous>) at callAsyncCircusFn (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:233:10) at _callCircusTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:315:40) at _runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:251:3) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:125:9) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:120:9) at run (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:70:3) at runAndTransformResultsToJestFormat (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:122:21) at jestAdapter (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:79:19) at runTestInternal (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:367:16) at runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:444:34) at Object.worker (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/testWorker.js:106:12)
JavaScript (Node.js 20) 4/4: packages/components/src/slot-fill/test/slot.js#L273
Error: expect(received).toMatchSnapshot() Snapshot name: `Slot should render in expected order when fills unmounted 1` - Snapshot - 0 + Received + 1 @@ -1,7 +1,8 @@ <div> <div> + first second third first (rerendered) fourth (new) </div> at Object.toMatchSnapshot (/home/runner/work/gutenberg/gutenberg/packages/components/src/slot-fill/test/slot.js:273:23) at Promise.then.completed (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:300:28) at new Promise (<anonymous>) at callAsyncCircusFn (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/utils.js:233:10) at _callCircusTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:315:40) at _runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:251:3) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:125:9) at _runTestsForDescribeBlock (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:120:9) at run (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/run.js:70:3) at runAndTransformResultsToJestFormat (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:122:21) at jestAdapter (/home/runner/work/gutenberg/gutenberg/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:79:19) at runTestInternal (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:367:16) at runTest (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/runTest.js:444:34) at Object.worker (/home/runner/work/gutenberg/gutenberg/node_modules/jest-runner/build/testWorker.js:106:12)
JavaScript (Node.js 20) 4/4
Process completed with exit code 1.
JavaScript (Node.js 20) 2/4: packages/components/src/tools-panel/test/index.tsx#L37
TestingLibraryElementError: Unable to find an accessible element with the role "button" and name `/Panel([\w\s]+)header([\w\s]+)options/i` Here are the accessible roles: heading: Name "Panel header": <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <p class="a11y-speak-intro-text" id="a11y-speak-intro-text" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Notifications </p> <div aria-atomic="true" aria-live="assertive" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-assertive" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Alt is now visible </div> <div aria-atomic="true" aria-live="polite" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-polite" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" /> <div class="components-popover__fallback-container" /> <div> <div class="components-grid components-tools-panel css-v55b57-PolymorphicDiv-gridClasses-columns-spacing-ToolsPanel e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanel" > <div class="components-flex components-h-stack components-tools-panel-header css-1ey1u11-PolymorphicDiv-Flex-base-ItemsRow-fullWidth-ToolsPanelHeader e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanelHeader" > <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" > Panel header </h2> </div> </div> </div> </body> at Object.getElementError (/home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/config.js:37:19) at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:76:38 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:52:17 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:95:19 at getByRole (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:175:16) at Object.getMenuButton (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:1005:17)
JavaScript (Node.js 20) 2/4: packages/components/src/tools-panel/test/index.tsx#L37
TestingLibraryElementError: Unable to find an accessible element with the role "menuitemcheckbox" and name "Hide and reset Example" Here are the accessible roles: heading: Name "Panel header": <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <p class="a11y-speak-intro-text" id="a11y-speak-intro-text" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Notifications </p> <div aria-atomic="true" aria-live="assertive" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-assertive" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Alt is now visible </div> <div aria-atomic="true" aria-live="polite" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-polite" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" /> <div class="components-popover__fallback-container" /> <div> <div class="components-grid components-tools-panel css-v55b57-PolymorphicDiv-gridClasses-columns-spacing-ToolsPanel e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanel" > <div class="components-flex components-h-stack components-tools-panel-header css-1ey1u11-PolymorphicDiv-Flex-base-ItemsRow-fullWidth-ToolsPanelHeader e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanelHeader" > <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" > Panel header </h2> </div> </div> </div> </body> at Object.getElementError (/home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/config.js:37:19) at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:76:38 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:52:17 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:95:19 at Object.getByRole (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:1128:12)
JavaScript (Node.js 20) 2/4
Process completed with exit code 1.
JavaScript (Node.js 22) 2/4: packages/components/src/tools-panel/test/index.tsx#L37
TestingLibraryElementError: Unable to find an accessible element with the role "button" and name `/Panel([\w\s]+)header([\w\s]+)options/i` Here are the accessible roles: heading: Name "Panel header": <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <p class="a11y-speak-intro-text" id="a11y-speak-intro-text" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Notifications </p> <div aria-atomic="true" aria-live="assertive" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-assertive" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Alt is now visible </div> <div aria-atomic="true" aria-live="polite" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-polite" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" /> <div class="components-popover__fallback-container" /> <div> <div class="components-grid components-tools-panel css-v55b57-PolymorphicDiv-gridClasses-columns-spacing-ToolsPanel e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanel" > <div class="components-flex components-h-stack components-tools-panel-header css-1ey1u11-PolymorphicDiv-Flex-base-ItemsRow-fullWidth-ToolsPanelHeader e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanelHeader" > <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" > Panel header </h2> </div> </div> </div> </body> at Object.getElementError (/home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/config.js:37:19) at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:76:38 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:52:17 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:95:19 at getByRole (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:175:16) at Object.getMenuButton (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:1005:17)
JavaScript (Node.js 22) 2/4: packages/components/src/tools-panel/test/index.tsx#L37
TestingLibraryElementError: Unable to find an accessible element with the role "menuitemcheckbox" and name "Hide and reset Example" Here are the accessible roles: heading: Name "Panel header": <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" /> -------------------------------------------------- Ignored nodes: comments, script, style <body> <p class="a11y-speak-intro-text" id="a11y-speak-intro-text" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Notifications </p> <div aria-atomic="true" aria-live="assertive" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-assertive" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" > Alt is now visible </div> <div aria-atomic="true" aria-live="polite" aria-relevant="additions text" class="a11y-speak-region" id="a11y-speak-polite" style="position: absolute;margin: -1px;padding: 0;height: 1px;width: 1px;overflow: hidden;clip: rect(1px, 1px, 1px, 1px);-webkit-clip-path: inset(50%);clip-path: inset(50%);border: 0;word-wrap: normal !important;" /> <div class="components-popover__fallback-container" /> <div> <div class="components-grid components-tools-panel css-v55b57-PolymorphicDiv-gridClasses-columns-spacing-ToolsPanel e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanel" > <div class="components-flex components-h-stack components-tools-panel-header css-1ey1u11-PolymorphicDiv-Flex-base-ItemsRow-fullWidth-ToolsPanelHeader e19lxcc00" data-wp-c16t="true" data-wp-component="ToolsPanelHeader" > <h2 class="components-truncate components-text components-heading css-1k11gp8-PolymorphicDiv-Text-sx-Base-block-ToolsPanelHeading e19lxcc00" data-wp-c16t="true" data-wp-component="Heading" > Panel header </h2> </div> </div> </div> </body> at Object.getElementError (/home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/config.js:37:19) at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:76:38 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:52:17 at /home/runner/work/gutenberg/gutenberg/node_modules/@testing-library/dom/dist/query-helpers.js:95:19 at Object.getByRole (/home/runner/work/gutenberg/gutenberg/packages/components/src/tools-panel/test/index.tsx:1128:12)
JavaScript (Node.js 22) 2/4
Process completed with exit code 1.
Mobile
Process completed with exit code 1.
JavaScript Date Tests (Node.js 22)
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript Date Tests (Node.js 20)
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 22) 4/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 22) 3/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 20) 4/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 20) 2/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 20) 3/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 22) 1/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 22) 2/4
Both node-version and node-version-file inputs are specified, only node-version will be used
JavaScript (Node.js 20) 1/4
Both node-version and node-version-file inputs are specified, only node-version will be used

Artifacts

Produced during runtime
Name Size
build-assets
14 MB