Merge pull request #1966 from visualize-admin/test/e2e-maintenance

chore: E2E tests maintenance

CHANGELOG.md

@@ -34,6 +34,9 @@ You can also check the
 - Maintenance
   - Re-enabled screenshot tests using Argos CI
   - Fixed E2E HAR-based tests
+  - Added two new E2E tests for chart actions (duplication, image download)
+  - Improved performance of E2E tests by using cached LINDAS endpoints in chart
+    config fixtures
   - Fixed map dimension symbols to increase the elements size for small values,
     whilst preventing any 0 and undefined values from displaying
   - Updated Next.js to v14

app/charts/shared/chart-helpers.spec.tsx

@@ -18,9 +18,9 @@ import {
   InteractiveFiltersState,
   useChartInteractiveFilters,
 } from "@/stores/interactive-filters";
-import dualLine1Fixture from "@/test/__fixtures/config/dev/chartConfig-photovoltaik-und-gebaudeprogramm.json";
 import map1Fixture from "@/test/__fixtures/config/int/map-nfi.json";
 import line1Fixture from "@/test/__fixtures/config/prod/line-1.json";
+import dualLine1Fixture from "@/test/__fixtures/config/test/chartConfig-photovoltaik-und-gebaudeprogramm.json";
 import { migrateChartConfig } from "@/utils/chart-config/versioning";
 
 jest.mock("../../rdf/extended-cube", () => ({

app/charts/shared/use-sync-interactive-filters.spec.tsx

@@ -10,7 +10,7 @@ import {
   InteractiveFiltersProvider,
   useChartInteractiveFilters,
 } from "@/stores/interactive-filters";
-import fixture from "@/test/__fixtures/config/dev/4YL1p4QTFQS4.json";
+import fixture from "@/test/__fixtures/config/test/4YL1p4QTFQS4.json";
 import { migrateChartConfig } from "@/utils/chart-config/versioning";
 
 jest.mock("next/router", () => {

app/components/chart-selection-tabs.tsx

@@ -282,6 +282,7 @@ const TabsEditable = (props: TabsEditableProps) => {
                   type: "CHART_ACTIVE_FIELD_CHANGED",
                   value: "label",
                 });
+                handleClose();
               }}
             />
           )}
@@ -482,6 +483,7 @@ const TabsInner = ({
                             component="div"
                             key={d.key}
                             value={`${i}`}
+                            data-testid="chart-selection-tab"
                             className={clsx(
                               classes.tab,
                               // We need to add the "selected" class ourselves since we are wrapping

app/components/chart-shared.tsx

@@ -187,6 +187,7 @@ export const ChartMoreButton = ({
         onClick={(ev) => setAnchor(ev.currentTarget)}
         sx={{ height: "fit-content" }}
         {...DISABLE_SCREENSHOT_ATTR}
+        data-testid="chart-more-button"
       >
         <SvgIcMore />
       </IconButton>
@@ -519,7 +520,7 @@ const usePNGMetadata = ({
       .map((cube) =>
         cube.contactPoint
           ? `${cube.contactPoint.name} (${cube.contactPoint.email})`
-          : cube.creator?.label ?? cube.publisher
+          : (cube.creator?.label ?? cube.publisher)
       )
       .join(", ");
     const publisherMetadata = publisher

app/components/debug-search.tsx

@@ -1,8 +1,7 @@
-import { FormControlLabel, Stack } from "@mui/material";
+import { Box, Chip, FormControlLabel, Stack } from "@mui/material";
 import Accordion from "@mui/material/Accordion";
 import AccordionDetails from "@mui/material/AccordionDetails";
 import AccordionSummary from "@mui/material/AccordionSummary";
-import { Box, Chip } from "@mui/material";
 import CircularProgress from "@mui/material/CircularProgress";
 import MenuItem from "@mui/material/MenuItem";
 import Select from "@mui/material/Select";

app/components/graphql-termsets.stories.tsx

@@ -19,7 +19,7 @@ export const Termsets = () => {
     variables: {
       locale: "en",
       sourceType: "sparql",
-      sourceUrl: "https://lindas.admin.ch/query",
+      sourceUrl: "https://lindas-cached.cluster.ldbar.ch/query",
       cubeFilter: {
         iri: cube,
       },

app/configurator/components/add-dataset-dialog.mock.ts

@@ -5,7 +5,7 @@ export const photovoltaikChartStateMock: ConfiguratorStateConfiguringChart = {
   state: "CONFIGURING_CHART",
   dataSource: {
     type: "sparql",
-    url: "https://int.lindas.admin.ch/query",
+    url: "https://lindas-cached.int.cluster.ldbar.ch/query",
   },
   layout: {
     activeField: "y",

app/configurator/configurator-state/reducer.spec.tsx

@@ -35,8 +35,8 @@ import {
 } from "@/configurator/configurator-state/reducer";
 import { Dimension, Measure, NominalDimension } from "@/domain/data";
 import { stringifyComponentId } from "@/graphql/make-component-id";
-import covid19ColumnChartConfig from "@/test/__fixtures/config/dev/chartConfig-column-covid19.json";
-import covid19TableChartConfig from "@/test/__fixtures/config/dev/chartConfig-table-covid19.json";
+import covid19ColumnChartConfig from "@/test/__fixtures/config/test/chartConfig-column-covid19.json";
+import covid19TableChartConfig from "@/test/__fixtures/config/test/chartConfig-table-covid19.json";
 import covid19Metadata from "@/test/__fixtures/data/DataCubeMetadataWithComponentValues-covid19.json";
 import { getCachedComponents as getCachedComponentsOriginal } from "@/urql-cache";
 import { getCachedComponentsMock } from "@/urql-cache.mock";

app/docs/catalog/chart-preview-via-api.mdx

@@ -138,7 +138,7 @@ An example configurator state is shown below.
     "https://energy.ld.admin.ch/sfoe/bfe_ogd84_einmalverguetung_fuer_photovoltaikanlagen/7",
   dataSource: {
     type: "sparql",
-    url: "https://lindas.admin.ch/query",
+    url: "https://lindas-cached.cluster.ldbar.ch/query",
   },
   meta: {
     title: {

app/pages/_pivot.tsx

@@ -1,12 +1,12 @@
 import {
   Box,
+  Card as MUICard,
   CircularProgress,
   FormControlLabel,
-  Card as MUICard,
+  lighten,
   Switch,
   Theme,
   Typography,
-  lighten,
 } from "@mui/material";
 import { makeStyles, styled } from "@mui/styles";
 import clsx from "clsx";
@@ -34,7 +34,7 @@ const Card = styled(MUICard)({
 });
 
 const intDatasource = {
-  sourceUrl: "https://int.lindas.admin.ch/query",
+  sourceUrl: "https://lindas-cached.int.cluster.ldbar.ch/query",
   sourceType: "sparql",
 };
 
@@ -167,17 +167,15 @@ const PivotTable = ({ dataset }: { dataset: (typeof datasets)[string] }) => {
   const [{ data: componentsData, fetching: fetchingComponents }] =
     useDataCubesComponentsQuery({
       variables: {
-        sourceUrl: "https://int.lindas.admin.ch/query",
-        sourceType: "sparql",
+        ...intDatasource,
         locale: "en",
         cubeFilters: [{ iri: dataset.iri }],
       },
     });
   const [{ data: observationsData, fetching: fetchingObservations }] =
     useDataCubesObservationsQuery({
       variables: {
-        sourceUrl: "https://int.lindas.admin.ch/query",
-        sourceType: "sparql",
+        ...intDatasource,
         locale: "en",
         cubeFilters: [{ iri: dataset.iri }],
       },

app/pages/_preview.tsx

@@ -39,7 +39,7 @@ const CONFIGURATOR_STATE = {
     "https://energy.ld.admin.ch/sfoe/bfe_ogd84_einmalverguetung_fuer_photovoltaikanlagen/2",
   dataSource: {
     type: "sparql",
-    url: "https://lindas.admin.ch/query",
+    url: "https://lindas-cached.cluster.ldbar.ch/query",
   },
   meta: {
     title: { de: "", fr: "", it: "", en: "" },

app/pages/_preview_post.tsx

@@ -39,7 +39,7 @@ const photovoltaikanlagenState = {
     "https://energy.ld.admin.ch/sfoe/bfe_ogd84_einmalverguetung_fuer_photovoltaikanlagen/7",
   dataSource: {
     type: "sparql",
-    url: "https://lindas.admin.ch/query",
+    url: "https://lindas-cached.cluster.ldbar.ch/query",
   },
   meta: {
     title: {
@@ -111,7 +111,7 @@ const nfiState = {
   dataSet: "https://environment.ld.admin.ch/foen/nfi/nfi_C-1266/cube/2023-1",
   dataSource: {
     type: "sparql",
-    url: "https://int.lindas.admin.ch/query",
+    url: "https://lindas-cached.cluster.ldbar.ch/query",
   },
   meta: {
     title: {