Tengo un proyecto de Next.js para realizar algunas funciones geométricas. Para ello hago uso de la librería de mapas de openlayer. Cuando trato de utilizar Jest en Next.js para testear un componente que usa elementos de openlayer.js, me salta el siguiente error:
FAIL components/app/NewProject/MapComponents/CommonPivotSpatialFunctionsComponent/CopyPivotButtonComponent/CopyPivotButtonComponent.test.js
● Test suite failed to run
Jest encountered an unexpected token
Details:
A:\raul\proyectos\client_aiswo\node_modules\ol\index.js:5
export {default as Collection} from './Collection.js';
^^^^^^
SyntaxError: Unexpected token 'export'
11 | import { CopyOutlined } from "@ant-design/icons";
12 | import { styleForHoverInEdit } from "../../OlStyles/OlStylesFunctions";
> 13 | import { cleanInteractionByType } from "../../OlUtils/OlInteractionFunctions";
| ^
14 | import { getFeaturePivotProperties } from "../../OlUtils/OlGeometryFunctions";
15 | import { MAP_TOOL_BUTTONS_STATES, MAP_SIDE_BAR_STATES, I18N_NAMESPACES, MAP_FEATURE_TYPES } from "../../../../../../utils/constants";
16 | import { useLastLayer, useLastFeature, useFeature, useSectorType } from "../../../hooks";
at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1505:14)
at Object.<anonymous> (components/app/NewProject/MapComponents/CommonPivotSpatialFunctionsComponent/CopyPivotButtonComponent/index.js:13:13)
at Object.<anonymous> (components/app/NewProject/MapComponents/CommonPivotSpatialFunctionsComponent/CopyPivotButtonComponent/CopyPivotButtonComponent.test.js:6:53)
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 1.833 s
Ran all test suites.
El componente que estoy testeando es un componente de React que renderiza un botón que al ser clickeado ejecuta una función que permite copiar una geometría:
import React from 'react';
import { useSelector, useDispatch } from "react-redux";
import { useTranslation } from "react-i18next";
import { Feature } from "ol";
import { Vector as VectorLayer } from 'ol/layer';
import { Vector as VectorSource } from 'ol/source';
import { Draw, Modify, Snap, Translate, Select } from "ol/interaction";
import { Circle as CircleGeometry, Point as PointGeometry } from "ol/geom";
import { GeoJSON } from 'ol/format';
import * as turf from "@turf/turf";
import { CopyOutlined } from "@ant-design/icons";
import { styleForHoverInEdit } from "../../OlStyles/OlStylesFunctions";
import { cleanInteractionByType } from "../../OlUtils/OlInteractionFunctions";
import { getFeaturePivotProperties } from "../../OlUtils/OlGeometryFunctions";
import { MAP_TOOL_BUTTONS_STATES, MAP_SIDE_BAR_STATES, I18N_NAMESPACES, MAP_FEATURE_TYPES } from "../../../../../../utils/constants";
import { useLastLayer, useLastFeature, useFeature, useSectorType } from "../../../hooks";
import { MAP_NAME, map as mapSlice, clonePivot, selectVersion } from "../../../api";
import MapToolsButton from "../../MapToolsButton";
export default function CopyPivotButtonComponent({ map }) {
const _copyCircles = () => {
// some code
};
const _copySector = () => {
//some code
}
return (
<MapToolsButton
//some code
/>
)
}
El componente de test es:
import CopyPivotButtonComponent from './index';
import { render, fireEvent } from '@testing-library/react';
describe('CopyPivotButtonComponent', () => {
test('should render CopyPivotButtonComponent correctly', () => {
const { getByText } = render(<CopyPivotButtonComponent />);
expect(getByText('Copy')).toBeInTheDocument();
});
La configuración de jest es:
const nextJest = require('next/jest')
/** @type {import('jest').Config} */
const createJestConfig = nextJest({
// Provide the path to your Next.js app to load next.config.js and .env files in your test environment
dir: './',
})
// Add any custom config to be passed to Jest
const config = {
// collectCoverage: true,
// coverageDirectory: "coverage",
// coverageProvider: "v8",
testEnvironment: "jsdom",
// Add more setup options before each test is run
setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
}
// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
module.exports = createJestConfig(config)