Getting could not locate module issue while testing #sendgrid/mail with jest - node.js

Blockquote
I am getting this error while testing apis
*> Configuration error:
>
> Could not locate module ./src/classes/mail-service mapped as:
> C:\Users\ASUS\Documents\GitHub\NEOS FLOW\flow\#server\profile-service\src\$1.
>
> Please check your configuration for these entries:
> > {
> > "moduleNameMapper": {
> > "/src\/(.*)/": "C:\Users\ASUS\Documents\GitHub\NEOS FLOW\flow\#server\profile-service\src\$1"
> > },
> > "resolver": undefined
> > }
>
> 1 | import sgMail from "#sendgrid/mail";
> > | ^
> *
this is my jest.configs.ts
module.exports = {
preset: "ts-jest",
testEnvironment: "node",
coverageDirectory: "coverage",
collectCoverageFrom: ["src/**/*.{js,ts}"],
forceExit: true,
coverageThreshold: {
global: {
branches: 0,
functions: 0,
lines: 0,
statements: 0,
},
},
moduleNameMapper: {
"src/(.*)": "<rootDir>/src/$1",
},
transformIgnorePatterns: ["<rootDir>/node_modules/"],
};
As I guess this is failing because node_module is not able to find #sendgrid/mail package in it .
I tried with to delete and install node_module but didn't work.
jest 29.3.1 version. Node.js v18.13.0.
Please suggest any solution.
Thankyou, Have a great day.

Related

Why am I getting "Jest encountered an unexpected token" when using detox with expo-updates?

I want to use expo-updates package with detox and jest, however I keep getting the following error:
FAIL test/e2e/starter.test.ts..
● Test suite failed to run
Jest encountered an unexpected token
...
Details:
<Redacted>/node_modules/expo-updates/build/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){export * from './Updates';
^^^^^^
SyntaxError: Unexpected token 'export'
1 | import { expect, device, by } from 'detox'
> 2 | import * as Updates from 'expo-updates'
| ^
3 |
4 | describe('Example', () => {
5 | beforeAll(async () => {
I have this jest.config.js
module.exports = {
preset: 'ts-jest',
rootDir: '..',
testMatch: ['<rootDir>/**/*.test.ts'],
testTimeout: 120000,
maxWorkers: 1,
reporters: ['detox/runners/jest/reporter'],
globalSetup: 'detox/runners/jest/globalSetup',
globalTeardown: 'detox/runners/jest/globalTeardown',
testEnvironment: 'detox/runners/jest/testEnvironment',
transformIgnorePatterns: ['node_modules/(?!expo-updates)'],
transform: {
'^.+\\.ts?$': 'ts-jest',
'^.+\\.(js|jsx)$': 'babel-jest',
},
verbose: true,
}
and I added to babel.config.js
presets: [
['#babel/preset-env', { targets: { node: 'current' } }],
'#babel/preset-typescript',
]
So what else can I do?
Using these versions:
ts-jest: 29.0.3
babel: 29.3.1
expo-updates: 0.14.7

How to override the rollup output.format setting in vite?

I'm trying to solve the Vite build error I get:
RollupError: Invalid value "iife" for option "output.format" - UMD and IIFE output formats are not supported for code-splitting builds.
The file name reported with this error points to
my web worker code, so I assumed that this setting belongs to the worker section in vite.config.ts:
import { defineConfig } from "vite";
import preact from "#preact/preset-vite";
import basicSsl from "#vitejs/plugin-basic-ssl";
import { NodeGlobalsPolyfillPlugin } from "#esbuild-plugins/node-globals-polyfill";
import { NodeModulesPolyfillPlugin } from "#esbuild-plugins/node-modules-polyfill";
import rollupNodePolyFill from "rollup-plugin-node-polyfills";
export default defineConfig({
plugins: [
preact(),
basicSsl(),
],
server: {
port: 3001,
https: true,
},
optimizeDeps: {
esbuildOptions: {
// Node.js global to browser globalThis
define: {
global: "globalThis",
},
// Enable esbuild polyfill plugins
plugins: [
NodeGlobalsPolyfillPlugin({
process: true,
buffer: true,
}),
NodeModulesPolyfillPlugin(),
],
},
},
worker: {
rollupOptions: {
output: {
format: "esm",
},
},
},
build: {
rollupOptions: {
plugins: [
// Enable rollup polyfills plugin
// used during production bundling
rollupNodePolyFill(),
],
output: {
format: "esm",
},
},
},
});
Additionally, I set the output format in the build rollup options. However, neither of the two settings are applied and I still get the said error.
What is the correct way to change the rollup output format setting in Vite?
The worker output format must be specified directly in the worker config key, not its rollup options:
import { defineConfig } from "vite";
import preact from "#preact/preset-vite";
import basicSsl from "#vitejs/plugin-basic-ssl";
import { NodeGlobalsPolyfillPlugin } from "#esbuild-plugins/node-globals-polyfill";
import { NodeModulesPolyfillPlugin } from "#esbuild-plugins/node-modules-polyfill";
import rollupNodePolyFill from "rollup-plugin-node-polyfills";
export default defineConfig({
plugins: [
preact(),
basicSsl(),
],
server: {
port: 3001,
https: true,
},
optimizeDeps: {
esbuildOptions: {
// Node.js global to browser globalThis
define: {
global: "globalThis",
},
// Enable esbuild polyfill plugins
plugins: [
NodeGlobalsPolyfillPlugin({
process: true,
buffer: true,
}),
NodeModulesPolyfillPlugin(),
],
},
},
worker: {
format: "es",
},
build: {
rollupOptions: {
plugins: [
// Enable rollup polyfills plugin
// used during production bundling
rollupNodePolyFill(),
],
output: {
format: "esm",
},
},
},
});

Can't run wallaby.js with jest in vscode

I have a project with jest and typescript. When I run jest, the tests run correctly.
I prepared the wallaby.config.js file:
// wallaby.config.js
export default function () {
return {
autoDetect: true,
trace: true,
files: ['src/**', '!**/*Spec.ts'],
tests: ['__tests__/**/*Spec.ts'],
debug: true,
env: {
type: 'node',
runner: 'node',
},
};
}
When I try to start I get:
Failed to initialize wallaby jest. 
Failed to read Jest configuration from '.': m is not defined 
My packages.json as type = "module"
Also, my jest.config.js looks like:
export default {
verbose: true,
testMatch: ['<rootDir>/__tests__/**/*.ts'],
preset: 'ts-jest',
testEnvironment: 'node',
};
As I said at begin, if I type npx jest works correctly.
I want wallaby working on my vscode.
Finally I found a workaround.
First of all install jasmine and esm as dev dependency.
Now update the wallay.config.js file:
export default function configure(wallaby) {
return {
trace: true,
files: ['src/**', '!**/*Spec.ts'],
tests: ['__tests__/**/*Spec.ts'],
debug: true,
testFramework: 'jasmine', // <- added
env: {
type: 'node',
runner: 'node',
params: { //
runner: `-r esm`, // <- added
}, //
},
};
}
Now all work. I'm running test manually with jest and wallaby is using jasmine. It doesn't seem best way but works for now.

Jest: SyntaxError: Unexpected token 'export' happens at tslib.es6.js

I get this error:
C:\Users\myname\Projects\ConfigEditor\MesConfiguration.WebClient\node_modules\tslib\tslib.es6.js:24
export function __extends(d, b) {
^^^^^^
SyntaxError: Unexpected token 'export'
My jest-esm.config.mjs looks like this
const jestConfig = {
preset: 'jest-preset-angular/presets/defaults-esm',
extensionsToTreatAsEsm: ['.ts'],
globals: {
'ts-jest': {
useESM: true,
stringifyContentPathRegex: '\\.(html|svg)$',
tsconfig: '<rootDir>/tsconfig-esm.spec.json',
},
},
testEnvironment: 'jsdom',
moduleFileExtensions: ['ts', 'html', 'js', 'json', 'mjs'],
resolver: 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
transform: {
'^.+\\.(ts|js|mjs|html|svg)$': 'jest-preset-angular',
},
globalSetup: 'jest-preset-angular/global-setup',
moduleNameMapper: {
//tslib: 'tslib/tslib.mjs',
tslib: 'tslib/tslib.es6.js',
"#shared/(.*)": "<rootDir>/src/app/shared/$1",
"#editors/(.*)": "<rootDir>/src/app/editors/$1",
"#dashboard/(.*)": "<rootDir>/src/app/dashboard/$1",
"#env": "<rootDir>/src/environments/environment",
},
setupFilesAfterEnv: ['<rootDir>/src/setup-jest.ts'],
}
export default jestConfig;
package.json has
"type": "module",
I start the test with
"test-esm": "node --experimental-vm-modules --no-warnings node_modules/jest/bin/jest.js -c=jest-esm.config.mjs --no-cache",
What ist wrong?
After renaming the tslib.es6.js to tslib.mjs the error is gone, but this is no solution. It should work after any yarn install
The error is gone because you have set
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)']
you are basically using the preset jest-preset-angular/presets/defaults-esm So most of the properties you are typing in the config are redundant
One thing is that the transformIgnorePatterns somehow does not work with multiple items in that array (in some cases) so it is better to put everything at once like in my case
transformIgnorePatterns: ['node_modules/(?!rxjs|tslib)']
here is my full jest.config.js and setup-jest.ts file I am using with Angular14 with the ESM execution node --experimental-vm-modules node_modules/jest/bin/jest.js
// jest-config.ts
module.exports = {
preset: 'jest-preset-angular/presets/defaults-esm',
testRegex: '.*spec.ts$',
transformIgnorePatterns: [
'node_modules/(?!rxjs|tslib)'
],
moduleNameMapper: {
"^dnd-core$": "dnd-core/dist",
"^react-dnd$": "react-dnd/dist",
"^react-dnd-html5-backend$": "react-dnd-html5-backend/dist",
"^react-dnd-touch-backend$": "react-dnd-touch-backend/dist",
"^react-dnd-test-backend$": "react-dnd-test-backend/dist",
"^react-dnd-test-utils$": "react-dnd-test-utils/dist"
},
setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
};
// setup-jest.ts
import 'jest-preset-angular/setup-jest.mjs';
Object.defineProperty(window, "getComputedStyle", {
value: () => ["-webkit-appearance"]
});

Gatsby Error ReferenceError: React is not defined when migrating from JSX to Typescript

I have a Gatsby project which I want to migrate from JSX to Typescript. I am following this guide to achieve this.
Configurations for Typescript are as follows:
tslint.json:
{
"rulesDirectory": "tslint-plugin-prettier",
"extends": ["tslint:latest", "tslint-react", "tslint-config-prettier"],
"rules": {
"prettier": true,
"jsx-no-multiline-js": false,
"jsx-no-lambda": false,
"import-name": false,
"no-boolean-literal-compare": false
}
}
tsconfig.json:
{
"compilerOptions": {
"outDir": "./built",
"allowJs": true,
"target": "es5"
},
"include": ["./src/**/*"]
}
package.json:
...
"type-check": "tsc --noEmit",
"lint": "tslint --project ."
...
gatsby-config.js:
module.exports = {
plugins: [
'gatsby-plugin-tslint', // TSLint
// TS Plugin. Gatsby already ships with TS
{
resolve: 'gatsby-plugin-typescript',
options: {
isTSX: true, // defaults to false
jsxPragma: 'jsx', // defaults to "React"
allExtensions: true, // defaults to false
},
}
]
};
I am getting the following error when I run gatsby develop:
error There was an error compiling the html.js component for the development server.
See our docs page on debugging HTML builds for help https://gatsby.dev/debug-html ReferenceError: React is not defined
18 | next: function (result) {
19 | if (_this.lastError || _this.isDifferentFromLastResult(result)) {
> 20 | _this.updateLastResult(result);
| ^
21 | iterateObserversSafely(_this.observers, 'next', result);
22 | }
23 | },
WebpackError: ReferenceError: React is not defined
I am using React import in ES5 format as follows:
import React, { useState } from "react";

Resources