Categories
Mastering Development

How to enable @ experimentalDecorators in next.config.js or babelrc

Hi if someone would help me, I wanna use @Decorators on my nextjs app, but I get the following error. Hope someone knows what Im doin wrong Error message: Syntax error: Support for the experimental syntax ‘decorators-legacy’ isn’t currently enabled: I’m trying to use typeorm / type-graphql to generate my backend in an app subfolder. […]

Categories
Mastering Development

Unable to load preload script – Electron.js Ubuntu 18.04.4

I’m trying to understand how to effectively load the proload.js file in electron: Version "electron": "^9.1.2", Version "electron-builder": "^22.8.0", In background.js I put webPreferences: { nodeIntegration: false, contextIsolation: true, //preload: path.join(app.getAppPath(), "preload.js"), preload: path.join(__dirname, "./preload.js"), }, preload.js and background.js are in the same folder: src folder. this is my preload.js : const { contextBridge, ipcRenderer […]

Categories
Mastering Development

Is it possible to configure wdio to make use of different tsconfig files?

I’m trying to get wdio setup to run our React TypeScript app. The problem is that it only works if I modify the tsconfig.json file itself to make use of the required types, change module to commonjs and set isolatedModules to false: { "compilerOptions": { "target": "es5", "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, […]

Categories
Mastering Development

Property ‘toBeInTheDocument’ does not exist on type ‘Matchers

Trying to setup testing for a components library. I’ve tried many example and all similar threads on this with no luck. My setupTests.ts file is correctly being loaded (proven with a console.log), and the library seems to be available as if I add import { toBeInTheDocument } from ‘@testing-library/jest-dom/matchers’ and log toBeInTheDocument it is present. […]

Categories
Development

Why is this React Typescript app throwing errors?

I just created a new React app using npx create-react-app my-app –template typescript and it was working fine until I changed my component to from a stateless one to a stateful one. The error: JSX element type ‘App’ is not a constructor function for JSX elements. TS2605 3 | import App from “./App”; 4 | […]

Categories
Development

“Navbar refers to a value, but is being used as a type here” when trying to render a shallow copy of my component when testing

I am trying to write a test to my React component, using TypeScript, Jest as my test runner and Enzyme for testing my React components. Whenever I pass my component into the shallow Enzyme function, I get the ts error “‘Navbar’ refers to a value, but is being used as a type here.”, and underneath […]

Categories
Development Vue

How to configure Jest added to an app via Vue cli 3?

I’m trying to introduce testing with Jest into an app build with Vue. I’ve run vue add unit-jest and similarly to what testing single file components with Jest guide suggests, created the following simple test file (Paginator.spec.js in the same folder as Paginator.vue, that is /src/components): import { mount } from ‘@vue/test-utils’ import Paginator from […]

Categories
Development

How to correctly type the apply method for browser console logging functions?

I’ve written the below class to capture the console.log function in my app so I can review the logs on devices where I can’t easily access the browser console and so later I can bundle the captured logs when reporting errors. In order to get it working, I’ve had to add ts-ignore like this: // […]

Categories
Development

WebStorm breakpoints issue with TypeScript React App (using webpack)

I tried to configure the JavaScript Debugger as the WebStorm website is telling so: https://blog.jetbrains.com/webstorm/2017/01/debugging-react-apps/ However, it worked like for 2 minutes and it doesn’t work anymore, I can’t tell why.. Is it at least stable with TypeScript? Can I use the JavaScript Debugger? Edit 1 (based on @lena comment) Here you can find my […]