fix wcag error and improve PDF testing

src/layout/Map/Map.tsx

@@ -146,14 +146,13 @@ export function Map({
           {label && (
             <Tooltip
               permanent={true}
-              interactive={true}
+              content={label}
+              interactive={isInteractive}
               direction='top'
               eventHandlers={{
                 click: (e) => e.originalEvent.preventDefault(),
               }}
-            >
-              {label}
-            </Tooltip>
+            />
           )}
         </GeoJSON>
       ))}

src/layout/Map/MapComponent.module.css

@@ -8,17 +8,19 @@
 }
 
 /**
-* This will give the map a square aspect ratio when loading the print page
+* This will give the map an (almost) square aspect ratio when loading the print page
 * Since it has @media only screen it will still scale to fit the page,
 * but the initial fitBounds will not depend on the PDF-service's browser viewport
 * Ideally, the browser's viewport would match the pages aspect ratio, as
 * geometries could still be cut off for extremely narrow pages, and would have a lot of
 * space on the right side for a landscape print, but for all "normal" portrait page formats
 * this should work well.
+* Additionally, for very wide pages the map tiles on the far right will not have a chance to
+* load before the page prints, but you should at least see the relevant area.
 **/
 @media only screen {
   .print-hack {
-    width: 40rem;
+    width: 42rem;
   }
 }
 

test/e2e/integration/frontend-test/components.ts

@@ -746,6 +746,11 @@ describe('UI Components', () => {
   it('Map component with simpleBinding', () => {
     cy.intercept('GET', 'https://cache.kartverket.no/**/*.png', { fixture: 'map-tile.png' });
     cy.intercept('GET', 'https://tile.openstreetmap.org/**/*.png', { fixture: 'map-tile.png' });
+    cy.interceptLayout('changename', (comp) => {
+      if (comp.id === 'map' && comp.type === 'Map') {
+        delete comp.dataModelBindings.geometries;
+      }
+    });
 
     cy.goto('changename');
     cy.get(appFrontend.changeOfName.newFirstName).type('123');
@@ -784,8 +789,6 @@ describe('UI Components', () => {
     cy.interceptLayout('changename', (comp) => {
       if (comp.id === 'map' && comp.type === 'Map') {
         delete comp.dataModelBindings.simpleBinding;
-        delete comp.centerLocation;
-        delete comp.zoom;
       }
     });
 

test/e2e/integration/frontend-test/pdf.ts

@@ -101,7 +101,7 @@ describe('PDF', () => {
       cy.getSummary('Adresse').should('contain.text', 'Økern 1');
       cy.getSummary('Velg lokasjon').findByAltText('Marker').should('be.visible');
       cy.getSummary('Velg lokasjon')
-        .findByText(/Valgt lokasjon: 59\.\d{6}° nord, 10\.\d{6}° øst/)
+        .findByText(/Valgt lokasjon: 67\.\d{6}° nord, 16\.\d{6}° øst/)
         .should('be.visible');
     });
   });

test/e2e/support/custom.ts

@@ -520,6 +520,13 @@ const DEFAULT_COMMAND_TIMEOUT = Cypress.config().defaultCommandTimeout;
 Cypress.Commands.add('testPdf', (snapshotName, callback, returnToForm = false) => {
   cy.log('Testing PDF');
 
+  // Store initial viewport size for later
+  const size = { width: 0, height: 0 };
+  cy.window().then((win) => {
+    size.width = win.innerWidth;
+    size.height = win.innerHeight;
+  });
+
   // Make sure instantiation is completed before we get the url
   cy.location('hash').should('contain', '#/instance/');
 
@@ -544,21 +551,24 @@ Cypress.Commands.add('testPdf', (snapshotName, callback, returnToForm = false) =
     cy.visit(visitUrl);
   });
 
-  // Enable print media emulation
-  cy.then(() =>
-    Cypress.automation('remote:debugger:protocol', {
-      command: 'Emulation.setEmulatedMedia',
-      params: { media: 'print' },
-    }),
-  );
-
   cy.readFile('test/percy.css').then((percyCSS) => {
     cy.reload();
 
     // Wait for readyForPrint, after this everything should be rendered so using timeout: 0
     cy.get('#pdfView > #readyForPrint')
       .should('exist')
       .then(() => {
+        // Enable print media emulation
+        cy.then(() =>
+          Cypress.automation('remote:debugger:protocol', {
+            command: 'Emulation.setEmulatedMedia',
+            params: { media: 'print' },
+          }),
+        );
+        // Set viewport to A4 paper
+        cy.viewport(794, 1123);
+        cy.get('body').invoke('css', 'margin', '0.75in');
+
         Cypress.config('defaultCommandTimeout', 0);
 
         // Verify that generic elements that should be hidden are not present
@@ -585,6 +595,9 @@ Cypress.Commands.add('testPdf', (snapshotName, callback, returnToForm = false) =
         params: {},
       }),
     );
+    // Revert to original viewport
+    cy.then(() => cy.viewport(size.width, size.height));
+    cy.get('body').invoke('css', 'margin', '');
 
     cy.location('href').then((href) => {
       cy.visit(href.replace('?pdf=1', ''));