diff --git a/package.json b/package.json index dd06d561e7..a95aca75b7 100644 --- a/package.json +++ b/package.json @@ -122,8 +122,8 @@ }, "dependencies": { "@date-fns/tz": "1.4.1", - "@digdir/designsystemet-css": "1.11.1", - "@digdir/designsystemet-react": "1.11.1", + "@digdir/designsystemet-css": "1.15.0", + "@digdir/designsystemet-react": "1.15.0", "@navikt/aksel-icons": "8.10.5", "@tanstack/react-query": "5.100.10", "@terraformer/wkt": "2.2.1", diff --git a/src/components/atoms/AltinnAttachments.tsx b/src/components/atoms/AltinnAttachments.tsx index 9ecafebf2d..cd28d1785c 100644 --- a/src/components/atoms/AltinnAttachments.tsx +++ b/src/components/atoms/AltinnAttachments.tsx @@ -5,7 +5,6 @@ import { Link, List } from '@digdir/designsystemet-react'; import cn from 'classnames'; import classes from 'src/components/atoms/AltinnAttachment.module.css'; -import { MainAttachmentHeader } from 'src/components/atoms/AttachmentHeader'; import { Lang } from 'src/features/language/Lang'; import { useCurrentLanguage } from 'src/features/language/LanguageProvider'; import { useLanguage } from 'src/features/language/useLanguage'; @@ -39,7 +38,7 @@ export function AltinnAttachments({ id={id} data-testid='attachment-list' > - + {title} { expect(console.error).not.toHaveBeenCalled(); - const showDetailsButton = screen.getByRole('button', { name: 'Vis detaljer om feilen' }); - await user.click(showDetailsButton); + const detailsGroup = screen.getByRole('group'); + expect(detailsGroup).toHaveTextContent('Vis detaljer om feilen'); + const summary = detailsGroup.querySelector('summary'); + if (!summary) { + throw new Error('Expected a inside the details group'); + } + await user.click(summary); expect(screen.getByText('Error test message')).toBeInTheDocument(); const writeTextMock = jest.spyOn(navigator.clipboard, 'writeText').mockResolvedValue(); diff --git a/src/layout/Accordion/Accordion.test.tsx b/src/layout/Accordion/Accordion.test.tsx index 49aac58edd..6df8a15d34 100644 --- a/src/layout/Accordion/Accordion.test.tsx +++ b/src/layout/Accordion/Accordion.test.tsx @@ -9,23 +9,23 @@ describe('Accordion', () => { it('should display text from textResourceBindings', async () => { await render({ title: 'Accordion title' }); - expect(await screen.findByRole('button', { name: /accordion title/i })).toBeInTheDocument(); + expect(await screen.findByRole('group')).toHaveTextContent(/accordion title/i); }); it('should display text from textResourceBindings if an ID to a text resource is used as title', async () => { await render({ title: 'accordion.title' }); - expect(await screen.findByRole('button', { name: /this is a title/i })).toBeInTheDocument(); + expect(await screen.findByRole('group')).toHaveTextContent(/this is a title/i); }); it('should open accordion by default if openByDefault is set to true', async () => { await render({ openByDefault: true, title: 'accordion.title' }); - expect(await screen.findByRole('button', { name: /this is a title/i })).toHaveAttribute('aria-expanded', 'true'); + expect(await screen.findByRole('group')).toHaveAttribute('open'); }); it('accordion should be closed by default if openByDefault is set to false', async () => { await render({ openByDefault: false, title: 'accordion.title' }); - expect(await screen.findByRole('button', { name: /this is a title/i })).toHaveAttribute('aria-expanded', 'false'); + expect(await screen.findByRole('group')).not.toHaveAttribute('open'); }); }); diff --git a/src/layout/AttachmentList/AttachmentListComponent.tsx b/src/layout/AttachmentList/AttachmentListComponent.tsx index 9c290c649e..6b8a170048 100644 --- a/src/layout/AttachmentList/AttachmentListComponent.tsx +++ b/src/layout/AttachmentList/AttachmentListComponent.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { AltinnAttachments } from 'src/components/atoms/AltinnAttachments'; +import { MainAttachmentHeader } from 'src/components/atoms/AttachmentHeader'; import { AttachmentGroupings } from 'src/components/organisms/AttachmentGroupings'; import { useApplicationMetadata } from 'src/features/applicationMetadata/ApplicationMetadataProvider'; import { useInstanceDataElements } from 'src/features/instance/InstanceContext'; @@ -82,7 +83,7 @@ export function AttachmentListComponent({ baseComponentId }: PropsFromGenericCom ) : ( : undefined} showLinks={showLinks} showDescription={showDescription} /> diff --git a/src/setupTests.ts b/src/setupTests.ts index 16ce7e38e8..f251638131 100644 --- a/src/setupTests.ts +++ b/src/setupTests.ts @@ -60,6 +60,11 @@ Element.prototype.getClientRects = () => ({ [Symbol.iterator]: jest.fn(), }); +// jsdom doesn't implement elementFromPoint, which Designsystemet's Popover uses +// in its `isTopLayer` check when handling Escape keydown. Returning the open +// popover element makes the check pass so ESC actually closes the popover in tests. +document.elementFromPoint = () => document.querySelector('[popover]'); + // Forcing a low timeout for useDelayedSaveState() global.delayedSaveState = 50; diff --git a/test/e2e/support/fail-on-console-log.ts b/test/e2e/support/fail-on-console-log.ts index f4abb7300a..7c2ea792f1 100644 --- a/test/e2e/support/fail-on-console-log.ts +++ b/test/e2e/support/fail-on-console-log.ts @@ -24,5 +24,11 @@ export const ignoredConsoleMessages = [ // https://github.com/Altinn/app-frontend-react/issues/1851 /Warning: validateDOMNesting.*?Add a , or to your code to match the DOM tree generated by the browser/, + // Designsystemet 1.15.0 deprecated RovingFocusRoot / RovingFocusItem / useRovingFocus without + // shipping a replacement. Used by LanguageSelector — remove once dsg provides a successor. + // https://github.com/Altinn/app-frontend-react/issues/4240 + /^Designsystemet: RovingFocus(Root|Item) is deprecated/, + /^Designsystemet: useRovingFocus is deprecated/, + /AxiosError: Request failed with status code 400/, ]; diff --git a/yarn.lock b/yarn.lock index d6c5278d01..e3d2f432e6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2108,40 +2108,51 @@ __metadata: languageName: node linkType: hard -"@digdir/designsystemet-css@npm:1.11.1": - version: 1.11.1 - resolution: "@digdir/designsystemet-css@npm:1.11.1" +"@digdir/designsystemet-css@npm:1.15.0": + version: 1.15.0 + resolution: "@digdir/designsystemet-css@npm:1.15.0" dependencies: - "@digdir/designsystemet-types": "npm:^1.11.1" - checksum: 10c0/59e4e1b739a55ea41c18f114c21b3affba2a2209c4a8a353ace7721bffb7441e20e603edd031087f78871c1073aeec380688b3c203c24452d9e9a82fb6a8d6bc + "@digdir/designsystemet-types": "npm:1.15.0" + checksum: 10c0/8b6722e99d9a0217a71a6c529b5f86f0109e2705ac297e35701a5d819e0102c1929cc64a66feb5113f65348d38ec3df7910af87379cb1ba34023626922c40647 languageName: node linkType: hard -"@digdir/designsystemet-react@npm:1.11.1": - version: 1.11.1 - resolution: "@digdir/designsystemet-react@npm:1.11.1" +"@digdir/designsystemet-react@npm:1.15.0": + version: 1.15.0 + resolution: "@digdir/designsystemet-react@npm:1.15.0" dependencies: - "@digdir/designsystemet-types": "npm:^1.11.1" - "@floating-ui/dom": "npm:^1.7.5" + "@digdir/designsystemet-types": "npm:1.15.0" + "@digdir/designsystemet-web": "npm:1.15.0" + "@floating-ui/dom": "npm:^1.7.6" "@floating-ui/react": "npm:0.26.23" - "@navikt/aksel-icons": "npm:^8.2.0" + "@navikt/aksel-icons": "npm:^8.10.5" "@radix-ui/react-slot": "npm:^1.2.4" - "@tanstack/react-virtual": "npm:^3.13.18" - "@u-elements/u-combobox": "npm:^1.0.7" - "@u-elements/u-datalist": "npm:^1.1.0" - "@u-elements/u-details": "npm:^0.1.5" + "@tanstack/react-virtual": "npm:^3.13.24" clsx: "npm:^2.1.1" peerDependencies: react: ">=18.3.1 || ^19.0.0" react-dom: ">=18.3.1 || ^19.0.0" - checksum: 10c0/77fa75942604990051cd82b50e68b4020571c1e0b3cf55de82802ab1e0f9fdb9988a217e418bcebb579b191f19badc3e086dbf73e299715cfe8e6e0804bc308e + checksum: 10c0/45ff9088aa46c9274d2f97d1c9bf96a16bca28bafe97134541c49b855f151f868fe825feb28debb674cb3984856a5fa94a602cf378d0d9e4b0946b315034f773 languageName: node linkType: hard -"@digdir/designsystemet-types@npm:^1.11.1": - version: 1.12.1 - resolution: "@digdir/designsystemet-types@npm:1.12.1" - checksum: 10c0/91f349e666a2d2f7471d3fd03c66489ea5e47754c04d58e810a154f1b949f3c82c05fefd9a715f6ddb90bb5ef277fe2a4f935c5bf434cd76791cc6de08b5fd8c +"@digdir/designsystemet-types@npm:1.15.0": + version: 1.15.0 + resolution: "@digdir/designsystemet-types@npm:1.15.0" + checksum: 10c0/672e73e95a60da80cbcefab8838003947849d8edd7ecc37af6e4de074592846f77e6fad92deccb19479c12e7833a2c25f9447b3be42738ecf3ed4a1d93869bc4 + languageName: node + linkType: hard + +"@digdir/designsystemet-web@npm:1.15.0": + version: 1.15.0 + resolution: "@digdir/designsystemet-web@npm:1.15.0" + dependencies: + "@floating-ui/dom": "npm:^1.7.6" + "@u-elements/u-combobox": "npm:^2.0.4" + "@u-elements/u-datalist": "npm:^2.0.1" + "@u-elements/u-details": "npm:^1.0.0" + "@u-elements/u-tabs": "npm:^1.0.3" + checksum: 10c0/74e69f1ef410ac6f0622f696b299d42c19ab553d439920849a0a2c31a20a90d49ffb06dbff2d698002097c4b147c8a487e65dd26d55610dc499cdf59537f78ab languageName: node linkType: hard @@ -2668,12 +2679,12 @@ __metadata: languageName: node linkType: hard -"@floating-ui/core@npm:^1.7.4": - version: 1.7.4 - resolution: "@floating-ui/core@npm:1.7.4" +"@floating-ui/core@npm:^1.7.5": + version: 1.7.5 + resolution: "@floating-ui/core@npm:1.7.5" dependencies: - "@floating-ui/utils": "npm:^0.2.10" - checksum: 10c0/b1175d92c0edbd0053c4ba014ad1f798ccc107de87a43a099e97af6265610cc25ef600f2b15d3763d39a79f7d36db11fcb84d0c28027beb3317e13a7ba197516 + "@floating-ui/utils": "npm:^0.2.11" + checksum: 10c0/f9c52205e198b231d63a387b09c659aab08c46a1899e0b0bbe147b8b4f048b546f15ba17cb5d2a471da9534f1883d979425e13e5c4ceee67be63e4b0abd4db5d languageName: node linkType: hard @@ -2687,13 +2698,13 @@ __metadata: languageName: node linkType: hard -"@floating-ui/dom@npm:^1.7.5": - version: 1.7.5 - resolution: "@floating-ui/dom@npm:1.7.5" +"@floating-ui/dom@npm:^1.7.6": + version: 1.7.6 + resolution: "@floating-ui/dom@npm:1.7.6" dependencies: - "@floating-ui/core": "npm:^1.7.4" - "@floating-ui/utils": "npm:^0.2.10" - checksum: 10c0/94bd262127fbf1177e542f4908cb07c17392782b1ca0ab9f2dfd7e102cabcc77b4de807847304dcb4c864d4b48e8ba292b27cdcfaca3ad4e3525ab397b766a3a + "@floating-ui/core": "npm:^1.7.5" + "@floating-ui/utils": "npm:^0.2.11" + checksum: 10c0/5c098e0d7b58c9bc769f276cca1766994c2c9c70c92d091a61bba8b3e9be53c011e0a79a8457fc2fb2f3d91697a26eb52e0a4962ef936dc963b45f58613c212f languageName: node linkType: hard @@ -2723,10 +2734,10 @@ __metadata: languageName: node linkType: hard -"@floating-ui/utils@npm:^0.2.10": - version: 0.2.10 - resolution: "@floating-ui/utils@npm:0.2.10" - checksum: 10c0/e9bc2a1730ede1ee25843937e911ab6e846a733a4488623cd353f94721b05ec2c9ec6437613a2ac9379a94c2fd40c797a2ba6fa1df2716f5ce4aa6ddb1cf9ea4 +"@floating-ui/utils@npm:^0.2.11": + version: 0.2.11 + resolution: "@floating-ui/utils@npm:0.2.11" + checksum: 10c0/f4bcea1559bdbb721ecc8e8ead423ac58d6a5b6e70b602cf0810ba6ad4ed1c77211b207faa88b278a9042f0c743133de08a203ed6741c1b6443423332884d5b3 languageName: node linkType: hard @@ -3538,10 +3549,10 @@ __metadata: languageName: node linkType: hard -"@navikt/aksel-icons@npm:^8.2.0": - version: 8.6.0 - resolution: "@navikt/aksel-icons@npm:8.6.0" - checksum: 10c0/fb6b54edb594f440db8d3ba93822f31e7c589ca1c2a8ccb49b5ff2f699a52faa77e692a981e0f5a98b339df7a8e130654517ff00e278c98953570a36ca3c2089 +"@navikt/aksel-icons@npm:^8.10.5": + version: 8.11.0 + resolution: "@navikt/aksel-icons@npm:8.11.0" + checksum: 10c0/86facf0f914164d1f3e7e298a80058bdc3ab16c6a40b8e197d07a1789e752c38ced953a78a4b232446bf4b68d658a6f3f4a8bdeae4b0ccbb5ba68039c78eadb4 languageName: node linkType: hard @@ -4497,22 +4508,22 @@ __metadata: languageName: node linkType: hard -"@tanstack/react-virtual@npm:^3.13.18": - version: 3.13.19 - resolution: "@tanstack/react-virtual@npm:3.13.19" +"@tanstack/react-virtual@npm:^3.13.24": + version: 3.13.26 + resolution: "@tanstack/react-virtual@npm:3.13.26" dependencies: - "@tanstack/virtual-core": "npm:3.13.19" + "@tanstack/virtual-core": "npm:3.16.0" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 - checksum: 10c0/3b3d512590980ac609b1b319948c0a3f75f4ffa28677329d3dca6bd1fa3b15a88ea4229e45e4f3803cfd97a3c587ab4a7d9f016ddf7ea8f02be3c76f86fcf993 + checksum: 10c0/f993dd0de6566c0f78d58a8183d9fad248c9a6ddf37e8572ea9cbb2a8635da16a368bfb7d44b8a84f6cd23fe927e96b9215927c14ef8381e2da8ed9e02f8e3be languageName: node linkType: hard -"@tanstack/virtual-core@npm:3.13.19": - version: 3.13.19 - resolution: "@tanstack/virtual-core@npm:3.13.19" - checksum: 10c0/7bcff6560902e157bec2753d009288bc3be0251a9762532cb2f43f9e9fb9b5d9a2d441eba87e0463c7a891e5966b9cfda88555d428149f6a7a54a65e66ba6726 +"@tanstack/virtual-core@npm:3.16.0": + version: 3.16.0 + resolution: "@tanstack/virtual-core@npm:3.16.0" + checksum: 10c0/03016cf464108ce8354d44d89393442e2457e0539933ee5af56691e76c0a351e268faf4f619395c5fabd3f2e4c23e5fc963b7f359d22805f2164be2403d2803e languageName: node linkType: hard @@ -5374,24 +5385,31 @@ __metadata: languageName: node linkType: hard -"@u-elements/u-combobox@npm:^1.0.7": - version: 1.0.7 - resolution: "@u-elements/u-combobox@npm:1.0.7" - checksum: 10c0/4a6d5c02946db27827a18ab4d6703820e11ef46dc66abed287cbf0a2c945db241d00731c64b828dbf3ebb9f33827d900561e09c8b1ceeacbc6f47ef0c2acd4c8 +"@u-elements/u-combobox@npm:^2.0.4": + version: 2.0.4 + resolution: "@u-elements/u-combobox@npm:2.0.4" + checksum: 10c0/e88030f2f7993e52a4d50d9f48c4240a29a2164ca24fa99ea562c6cdb8620dc7101c771649fab4d8ae2ecf4f7b8ededa3cbb1db389b48d18ae2d254bcc34a710 languageName: node linkType: hard -"@u-elements/u-datalist@npm:^1.1.0": - version: 1.1.0 - resolution: "@u-elements/u-datalist@npm:1.1.0" - checksum: 10c0/7aa76ad961bc11ea87be7b8589b990fc4066aae53a82691131d1afeb9511f261541fc0760e624c203f50ceb72796caa8204660f0add2c57508125ad918b935ca +"@u-elements/u-datalist@npm:^2.0.1": + version: 2.0.1 + resolution: "@u-elements/u-datalist@npm:2.0.1" + checksum: 10c0/77fec73e0afd07486dd70b12ddb14877349015e8a4d015c4b5523c38ebc2bf9015014e2775d54c67682f5c14820ecd357404b3de939372957457113d29a2d211 languageName: node linkType: hard -"@u-elements/u-details@npm:^0.1.5": - version: 0.1.5 - resolution: "@u-elements/u-details@npm:0.1.5" - checksum: 10c0/285342d86f8c4b9503ca707a368f07ef43d0d6370869098b59e1147c067fd0f475b0662a877a88a6a135c74624fc918971050f0715af67c0a2a88022fa85dbc0 +"@u-elements/u-details@npm:^1.0.0": + version: 1.0.0 + resolution: "@u-elements/u-details@npm:1.0.0" + checksum: 10c0/688df3e9657139bf506c81d70bd6aedf06a1619b1bbb78dd02f1b65a20765fa727fc7d577f513184f9cf563b658057ca44004a2703d1f14d71301a706849f1a2 + languageName: node + linkType: hard + +"@u-elements/u-tabs@npm:^1.0.3": + version: 1.0.3 + resolution: "@u-elements/u-tabs@npm:1.0.3" + checksum: 10c0/edaaabbaaa36afe7f7e2658e3fb3d87150dfbc69b6c6975f46eee839fce6f21f03d9f4840e6935d0523c5aa1436a56c6672033029d0fa53e6f8131a536b60260 languageName: node linkType: hard @@ -6021,8 +6039,8 @@ __metadata: "@babel/runtime": "npm:7.29.2" "@babel/runtime-corejs3": "npm:7.29.2" "@date-fns/tz": "npm:1.4.1" - "@digdir/designsystemet-css": "npm:1.11.1" - "@digdir/designsystemet-react": "npm:1.11.1" + "@digdir/designsystemet-css": "npm:1.15.0" + "@digdir/designsystemet-react": "npm:1.15.0" "@eslint/compat": "npm:2.1.0" "@eslint/js": "npm:^10.0.1" "@navikt/aksel-icons": "npm:8.10.5"