Set all gridsizes in state #9853
standerenfrontend-unit-tests.yml
on: push
CodeQL
3m 12s
Typechecking and linting
2m 5s
Testing
7m 4s
Building
2m 28s
Annotations
18 errors
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
Typechecking and linting
Type 'string' is not assignable to type 'number'.
|
|
EditGrid › should show grid value 4 on slider for mobile tab when xs: "4" is set on grid on component:
frontend/packages/ux-editor/src/components/config/editModal/EditGrid.test.tsx#L40
TestingLibraryElementError: Unable to find an element with the text: 4. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div>
<div
class="Toastify"
/>
</div>
<div>
<div
class="Toastify"
/>
<div>
<div
class="fds-tablist-tabItemList-670e7fb3"
role="tablist"
tabindex="0"
>
<button
aria-selected="true"
class="fds-tab-tabItem-bff6b3af fds-tab-small-bff6b3af fds-tab-isActive-bff6b3af"
data-roving-tabindex-item="true"
icon="[object Object]"
id="tab-:r0:"
role="tab"
tabindex="-1"
>
<span
class="fds-tab-icon-bff6b3af"
>
<svg
fill="none"
focusable="false"
height="1em"
role="img"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
clip-rule="evenodd"
d="M7.75 5.778c0-.614.455-1.028.917-1.028h6.666c.462 0 .917.414.917 1.028v12.444c0 .614-.455 1.028-.917 1.028H8.667c-.462 0-.917-.414-.917-1.028V5.778Zm.917-2.528c-1.38 0-2.417 1.178-2.417 2.528v12.444c0 1.35 1.037 2.528 2.417 2.528h6.666c1.38 0 2.417-1.178 2.417-2.528V5.778c0-1.35-1.037-2.528-2.417-2.528H8.667ZM12 16.75a.75.75 0 0 0 0 1.5h.01a.75.75 0 0 0 0-1.5H12Z"
fill="currentColor"
fill-rule="evenodd"
/>
</svg>
</span>
[mockedText(ux_editor.modal_properties_grid_size_xs)]
</button>
<button
aria-selected="false"
class="fds-tab-tabItem-bff6b3af fds-tab-small-bff6b3af"
data-roving-tabindex-item="true"
icon="[object Object]"
id="tab-:r2:"
role="tab"
tabindex="-1"
>
<span
class="fds-tab-icon-bff6b3af"
>
<svg
fill="none"
focusable="false"
height="1em"
role="img"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
clip-rule="evenodd"
d="M5.5 4.25A1.75 1.75 0 0 0 3.75 6v9c0 .966.784 1.75 1.75 1.75h13A1.75 1.75 0 0 0 20.25 15V6a1.75 1.75 0 0 0-1.75-1.75h-13ZM5.25 6a.25.25 0 0 1 .25-.25h13a.25.25 0 0 1 .25.25v9a.25.25 0 0 1-.25.25h-13a.25.25 0 0 1-.25-.25V6ZM3 18.25a.75.75 0 0 0 0 1.5h18a.75.75 0 0 0 0-1.5H3Z"
fill="currentColor"
fill-rule="evenodd"
/>
</svg>
</span>
[mockedText(ux_editor.modal_properties_grid_size_md)]
</button>
</div>
<div
class="fds-tabcontent-small-97d346db fds-tabcontent-tabContent-97d346db"
>
<div>
<p
class="fds-paragraph-paragraph-8425cac fds-paragraph-small-8425cac"
>
[mockedText(ux_editor.modal_properties_grid)]
</p>
</div>
<div
class=""
>
<input
id="range"
list="gridValues"
max="12"
min="1"
type="range"
value="4"
/>
<datalist
id="gridValues"
>
<option
label="1"
value="1"
/>
<option
label="2"
value="2"
/>
<option
label="3"
value="3"
/>
<option
label="4"
value="4"
/>
<option
label="5"
value="5"
/>
<option
label="6"
value="6"
/>
<option
label="7"
value="7"
/>
|
|
EditGrid › should show grid value 4 on slider for mobile tab when xs: "4" is set on grid on component:
frontend/libs/studio-components/src/components/StudioSlider/StudioSlider.tsx#L16
Expected test not to call console.error().
If the error is expected, test for it explicitly by mocking it out using jest.spyOn(console, 'error').mockImplementation() and test that the warning occurs.
Warning: Received `false` for a non-boolean attribute `className`.
If you want to write it to the DOM, pass a string instead: className="false" or className={value.toString()}.
If you used to conditionally omit it with className={condition && value}, pass className={condition ? value : undefined} instead.
at input
at div
at disabled (libs/studio-components/src/components/StudioSlider/StudioSlider.tsx:16:3)
at handleUpdateGrid (packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.tsx:27:3)
at div
at ../node_modules/@digdir/design-system-react/dist/cjs/index.js:7476:40
at div
at ../node_modules/@digdir/design-system-react/dist/cjs/index.js:7295:36
at handleComponentChange (packages/ux-editor/src/components/config/editModal/EditGrid.tsx:41:28)
at basenameProp (../node_modules/react-router/lib/components.tsx:383:13)
at basename (../node_modules/react-router-dom/index.tsx:718:3)
at Provider (../node_modules/react-redux/lib/components/Provider.js:19:3)
at children (packages/shared/src/providers/PreviewConnectionContext.tsx:11:52)
at QueryClientProvider (../node_modules/@tanstack/react-query/src/QueryClientProvider.tsx:30:3)
at ErrorBoundary (../node_modules/react-error-boundary/dist/react-error-boundary.cjs.js:16:5)
at children (packages/shared/src/contexts/ServicesContext.tsx:85:3)
at console.captureMessage [as error] (../node_modules/jest-fail-on-console/index.js:58:25)
at printWarning (../node_modules/react-dom/cjs/react-dom.development.js:86:30)
at error (../node_modules/react-dom/cjs/react-dom.development.js:60:7)
at validateProperty$1 (../node_modules/react-dom/cjs/react-dom.development.js:3767:9)
at warnUnknownProperties (../node_modules/react-dom/cjs/react-dom.development.js:3803:21)
at validateProperties$2 (../node_modules/react-dom/cjs/react-dom.development.js:3827:3)
at validatePropertiesInDevelopment (../node_modules/react-dom/cjs/react-dom.development.js:9541:5)
at setInitialProperties (../node_modules/react-dom/cjs/react-dom.development.js:9830:5)
at finalizeInitialChildren (../node_modules/react-dom/cjs/react-dom.development.js:10950:3)
at completeWork (../node_modules/react-dom/cjs/react-dom.development.js:22193:17)
at completeUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26593:16)
at performUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26568:5)
at workLoopSync (../node_modules/react-dom/cjs/react-dom.development.js:26466:5)
at renderRootSync (../node_modules/react-dom/cjs/react-dom.development.js:26434:7)
at performConcurrentWorkOnRoot (../node_modules/react-dom/cjs/react-dom.development.js:25738:74)
at flushActQueue (../node_modules/react/cjs/react.development.js:2667:24)
at act (../node_modules/react/cjs/react.development.js:2582:11)
at ../node_modules/@testing-library/react/dist/act-compat.js:46:25
at renderRoot (../node_modules/@testing-library/react/dist/pure.js:161:26)
at render (../node_modules/@testing-library/react/dist/pure.js:247:10)
at packages/ux-editor/src/testing/mocks.tsx:122:32
at render (packages/ux-editor/src/components/config/editModal/EditGrid.test.tsx:19:29)
at Object.<anonymous> (packages/ux-editor/src/components/config/editModal/EditGrid.test.tsx:29:5)
at flushUnexpectedConsoleCalls (../node_modules/jest-fail-on-console/index.js:40:13)
at Object.<anonymous> (../node_modules/jest-fail-on-console/index.js:113:7)
|
|
FormComponentConfig › should render expected components:
frontend/libs/studio-components/src/components/StudioSlider/StudioSlider.tsx#L16
Expected test not to call console.error().
If the error is expected, test for it explicitly by mocking it out using jest.spyOn(console, 'error').mockImplementation() and test that the warning occurs.
Warning: Received `false` for a non-boolean attribute `className`.
If you want to write it to the DOM, pass a string instead: className="false" or className={value.toString()}.
If you used to conditionally omit it with className={condition && value}, pass className={condition ? value : undefined} instead.
at option
at datalist
at div
at disabled (libs/studio-components/src/components/StudioSlider/StudioSlider.tsx:16:3)
at handleUpdateGrid (packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.tsx:27:3)
at div
at ../node_modules/@digdir/design-system-react/dist/cjs/index.js:7476:40
at div
at ../node_modules/@digdir/design-system-react/dist/cjs/index.js:7295:36
at handleComponentChange (packages/ux-editor/src/components/config/editModal/EditGrid.tsx:41:28)
at schema (packages/ux-editor/src/components/config/FormComponentConfig.tsx:29:3)
at basenameProp (../node_modules/react-router/lib/components.tsx:383:13)
at basename (../node_modules/react-router-dom/index.tsx:718:3)
at Provider (../node_modules/react-redux/lib/components/Provider.js:19:3)
at children (packages/shared/src/providers/PreviewConnectionContext.tsx:11:52)
at QueryClientProvider (../node_modules/@tanstack/react-query/src/QueryClientProvider.tsx:30:3)
at ErrorBoundary (../node_modules/react-error-boundary/dist/react-error-boundary.cjs.js:16:5)
at children (packages/shared/src/contexts/ServicesContext.tsx:85:3)
at console.captureMessage [as error] (../node_modules/jest-fail-on-console/index.js:58:25)
at printWarning (../node_modules/react-dom/cjs/react-dom.development.js:86:30)
at error (../node_modules/react-dom/cjs/react-dom.development.js:60:7)
at validateProperty$1 (../node_modules/react-dom/cjs/react-dom.development.js:3767:9)
at warnUnknownProperties (../node_modules/react-dom/cjs/react-dom.development.js:3803:21)
at validateProperties$2 (../node_modules/react-dom/cjs/react-dom.development.js:3827:3)
at validatePropertiesInDevelopment (../node_modules/react-dom/cjs/react-dom.development.js:9541:5)
at setInitialProperties (../node_modules/react-dom/cjs/react-dom.development.js:9830:5)
at finalizeInitialChildren (../node_modules/react-dom/cjs/react-dom.development.js:10950:3)
at completeWork (../node_modules/react-dom/cjs/react-dom.development.js:22193:17)
at completeUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26593:16)
at performUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26568:5)
at workLoopSync (../node_modules/react-dom/cjs/react-dom.development.js:26466:5)
at renderRootSync (../node_modules/react-dom/cjs/react-dom.development.js:26434:7)
at performConcurrentWorkOnRoot (../node_modules/react-dom/cjs/react-dom.development.js:25738:74)
at flushActQueue (../node_modules/react/cjs/react.development.js:2667:24)
at act (../node_modules/react/cjs/react.development.js:2582:11)
at ../node_modules/@testing-library/react/dist/act-compat.js:46:25
at renderRoot (../node_modules/@testing-library/react/dist/pure.js:161:26)
at render (../node_modules/@testing-library/react/dist/pure.js:247:10)
at packages/ux-editor/src/testing/mocks.tsx:122:32
at queries (packages/ux-editor/src/components/config/FormComponentConfig.test.tsx:148:36)
at Object.render (packages/ux-editor/src/components/config/FormComponentConfig.test.tsx:12:5)
at flushUnexpectedConsoleCalls (../node_modules/jest-fail-on-console/index.js:40:13)
at Object.<anonymous> (../node_modules/jest-fail-on-console/index.js:113:7)
|
|
EditGridForGivenViewSize › should show that default value:
frontend/libs/studio-components/src/components/StudioSlider/StudioSlider.tsx#L16
Expected test not to call console.error().
If the error is expected, test for it explicitly by mocking it out using jest.spyOn(console, 'error').mockImplementation() and test that the warning occurs.
Warning: Received `false` for a non-boolean attribute `className`.
If you want to write it to the DOM, pass a string instead: className="false" or className={value.toString()}.
If you used to conditionally omit it with className={condition && value}, pass className={condition ? value : undefined} instead.
at option
at datalist
at div
at disabled (libs/studio-components/src/components/StudioSlider/StudioSlider.tsx:16:3)
at handleUpdateGrid (packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.tsx:27:3)
at basenameProp (../node_modules/react-router/lib/components.tsx:383:13)
at basename (../node_modules/react-router-dom/index.tsx:718:3)
at Provider (../node_modules/react-redux/lib/components/Provider.js:19:3)
at children (packages/shared/src/providers/PreviewConnectionContext.tsx:11:52)
at QueryClientProvider (../node_modules/@tanstack/react-query/src/QueryClientProvider.tsx:30:3)
at ErrorBoundary (../node_modules/react-error-boundary/dist/react-error-boundary.cjs.js:16:5)
at children (packages/shared/src/contexts/ServicesContext.tsx:85:3)
at console.captureMessage [as error] (../node_modules/jest-fail-on-console/index.js:58:25)
at printWarning (../node_modules/react-dom/cjs/react-dom.development.js:86:30)
at error (../node_modules/react-dom/cjs/react-dom.development.js:60:7)
at validateProperty$1 (../node_modules/react-dom/cjs/react-dom.development.js:3767:9)
at warnUnknownProperties (../node_modules/react-dom/cjs/react-dom.development.js:3803:21)
at validateProperties$2 (../node_modules/react-dom/cjs/react-dom.development.js:3827:3)
at validatePropertiesInDevelopment (../node_modules/react-dom/cjs/react-dom.development.js:9541:5)
at setInitialProperties (../node_modules/react-dom/cjs/react-dom.development.js:9830:5)
at finalizeInitialChildren (../node_modules/react-dom/cjs/react-dom.development.js:10950:3)
at completeWork (../node_modules/react-dom/cjs/react-dom.development.js:22193:17)
at completeUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26593:16)
at performUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26568:5)
at workLoopSync (../node_modules/react-dom/cjs/react-dom.development.js:26466:5)
at renderRootSync (../node_modules/react-dom/cjs/react-dom.development.js:26434:7)
at performConcurrentWorkOnRoot (../node_modules/react-dom/cjs/react-dom.development.js:25738:74)
at flushActQueue (../node_modules/react/cjs/react.development.js:2667:24)
at act (../node_modules/react/cjs/react.development.js:2582:11)
at ../node_modules/@testing-library/react/dist/act-compat.js:46:25
at renderRoot (../node_modules/@testing-library/react/dist/pure.js:161:26)
at render (../node_modules/@testing-library/react/dist/pure.js:247:10)
at packages/ux-editor/src/testing/mocks.tsx:122:32
at render (packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.test.tsx:23:29)
at Object.<anonymous> (packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.test.tsx:34:5)
at flushUnexpectedConsoleCalls (../node_modules/jest-fail-on-console/index.js:40:13)
at Object.<anonymous> (../node_modules/jest-fail-on-console/index.js:113:7)
|
|
EditGridForGivenViewSize › should show slider value equals to grid xs: "2" when switching tab from laptop with grid md: "6":
frontend/packages/ux-editor/src/components/config/editModal/EditGridForGivenViewSize.test.tsx#L49
TestingLibraryElementError: Unable to find an accessible element with the role "tab" and name "[mockedText(ux_editor.modal_properties_grid_size_xs)]"
Here are the accessible roles:
slider:
Name "":
<input
id="range"
list="gridValues"
max="12"
min="1"
type="range"
value="6"
/>
--------------------------------------------------
checkbox:
Name "[mockedText(ux_editor.modal_properties_grid_use_default)]":
<input
class="fds-switch-input-6e30f7f5"
id="switch-:r2:"
type="checkbox"
/>
--------------------------------------------------
Ignored nodes: comments, script, style
<body>
<div>
<div
class="Toastify"
/>
</div>
<div>
<div
class="Toastify"
/>
<div>
<p
class="fds-paragraph-paragraph-8425cac fds-paragraph-small-8425cac"
>
[mockedText(ux_editor.modal_properties_grid)]
</p>
</div>
<div
class=""
>
<input
id="range"
list="gridValues"
max="12"
min="1"
type="range"
value="6"
/>
<datalist
id="gridValues"
>
<option
label="1"
value="1"
/>
<option
label="2"
value="2"
/>
<option
label="3"
value="3"
/>
<option
label="4"
value="4"
/>
<option
label="5"
value="5"
/>
<option
label="6"
value="6"
/>
<option
label="7"
value="7"
/>
<option
label="8"
value="8"
/>
<option
label="9"
value="9"
/>
<option
label="10"
value="10"
/>
<option
label="11"
value="11"
/>
<option
label="12"
value="12"
/>
</datalist>
</div>
<div
class="fds-paragraph-paragraph-8425cac fds-paragraph-small-8425cac fds-switch-switch-6e30f7f5"
>
<input
class="fds-switch-input-6e30f7f5"
id="switch-:r2:"
type="checkbox"
/>
<svg
class="fds-switch-icon-6e30f7f5"
fill="none"
height="32"
viewBox="0 0 56 34"
width="54"
xmlns="http://www.w3.org/2000/svg"
>
<rect
class="fds-switch-track-6e30f7f5"
fill="currentcolor"
height="32"
rx="16"
stroke="currentcolor"
stroke-linejoin="round"
stroke-width="2px"
width="54"
x="1"
y="1"
/>
<g
class="fds-switch-thumb-6e30f7f5"
>
<circle
cx="17"
cy="17"
fill="currentcolor"
height="30"
r="14"
width="30"
/>
<path
class="fds-switch-checkmark-6e30f7f5"
clip-rule="evenodd"
d="M18.1958 5.63756C18.8792 6.32098 18.8792 7.42902 18.1958 8.11244L10.4041 15.9041C9.72068 16.5875 8.61264 16.5875 7.92922 15.9041L3.80422 11.7791C3.1208 11.0957 3.1208 9.98765 3.80422 9.30423C4.48764 8.62081 5.59568 8.62081 6.27909 9.30423L9.16666 12.1918L15.7209 5.63756C16.4043 4.95415 17.5123 4.95415 18.1958 5.63756Z"
fill="currentcolor"
fill-rule="evenodd"
/>
</g>
</svg>
<label
class="fds-label-label-baf3c120 fds-label-small-baf3c120 fds-label-regularWeight-baf3c120 fds-switch-label-6e30f7f5"
for="switch-:r2:"
>
<span>
[mockedText(ux_editor.modal_properties_grid_use_default)]
</span>
</label>
</div>
</div>
</body>
at Object.getElementError (../node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/config.js:37:19)
at ../node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
at ../node_modules/@testing-library/react/node_modules/@testing-library/dom/dist/query-
|
|
StudioSlider › should render slider with value 12 and not disabled by default:
frontend/libs/studio-components/src/components/StudioSlider/StudioSlider.tsx#L16
Expected test not to call console.error().
If the error is expected, test for it explicitly by mocking it out using jest.spyOn(console, 'error').mockImplementation() and test that the warning occurs.
Warning: Received `false` for a non-boolean attribute `className`.
If you want to write it to the DOM, pass a string instead: className="false" or className={value.toString()}.
If you used to conditionally omit it with className={condition && value}, pass className={condition ? value : undefined} instead.
at input
at div
at disabled (libs/studio-components/src/components/StudioSlider/StudioSlider.tsx:16:3)
at console.captureMessage [as error] (../node_modules/jest-fail-on-console/index.js:58:25)
at printWarning (../node_modules/react-dom/cjs/react-dom.development.js:86:30)
at error (../node_modules/react-dom/cjs/react-dom.development.js:60:7)
at validateProperty$1 (../node_modules/react-dom/cjs/react-dom.development.js:3767:9)
at warnUnknownProperties (../node_modules/react-dom/cjs/react-dom.development.js:3803:21)
at validateProperties$2 (../node_modules/react-dom/cjs/react-dom.development.js:3827:3)
at validatePropertiesInDevelopment (../node_modules/react-dom/cjs/react-dom.development.js:9541:5)
at setInitialProperties (../node_modules/react-dom/cjs/react-dom.development.js:9830:5)
at finalizeInitialChildren (../node_modules/react-dom/cjs/react-dom.development.js:10950:3)
at completeWork (../node_modules/react-dom/cjs/react-dom.development.js:22193:17)
at completeUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26593:16)
at performUnitOfWork (../node_modules/react-dom/cjs/react-dom.development.js:26568:5)
at workLoopSync (../node_modules/react-dom/cjs/react-dom.development.js:26466:5)
at renderRootSync (../node_modules/react-dom/cjs/react-dom.development.js:26434:7)
at performConcurrentWorkOnRoot (../node_modules/react-dom/cjs/react-dom.development.js:25738:74)
at flushActQueue (../node_modules/react/cjs/react.development.js:2667:24)
at act (../node_modules/react/cjs/react.development.js:2582:11)
at ../node_modules/@testing-library/react/dist/act-compat.js:46:25
at renderRoot (../node_modules/@testing-library/react/dist/pure.js:161:26)
at render (../node_modules/@testing-library/react/dist/pure.js:247:10)
at Object.<anonymous> (libs/studio-components/src/components/StudioSlider/StudioSlider.test.tsx:7:11)
at flushUnexpectedConsoleCalls (../node_modules/jest-fail-on-console/index.js:40:13)
at Object.<anonymous> (../node_modules/jest-fail-on-console/index.js:113:7)
|
|
StudioSlider › should call onSliderChange when new value is clicked on slider:
frontend/libs/studio-components/src/components/StudioSlider/StudioSlider.test.tsx#L56
expect(jest.fn()).toHaveBeenCalledWith(...expected)
Expected: "6"
Received: 6
Number of calls: 1
at Object.toHaveBeenCalledWith (libs/studio-components/src/components/StudioSlider/StudioSlider.test.tsx:56:28)
|
|
Testing
Process completed with exit code 1.
|