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

Compiling typescript web worker works from command line but not from gulp

I have a web worker written in typescript. It compiles fine from the command line. However when I try to compile it in Gulp, I get weird type errors: /…/node_modules/@types/hls.js/index.d.ts(357,17): error TS2304: Cannot find name ‘SourceBuffer’. /…/node_modules/@types/hls.js/index.d.ts(1716,27): error TS2304: Cannot find name ‘AudioTrack’. … (more like that) I have no idea where those types come […]

Categories
Development

How to stop TypeScript error ‘Type A has no properties in common with Type B’ when Type B “extends” Type A in some way

(edited Title to make more general) I’m working in a codebase which uses React class components and Typescript everywhere, and I’m trying to implement react-dropzone (a lightweight, simple but effective file-drop component) using the class-based method. The Hooks implementation is cleaner and simpler but I’d prefer to avoid so as to preserve the paradigm maintained […]

Categories
Development

typescript cannot find module when import svg file

It’s web application created with Typescript, React and webpack. I want to use svg file through webpack. However, I got TS2307: Cannot find module ‘~/images/slide.svg’. Typescript files are put on /frontend/src/, and typescript files are build successfully. Then, I tried some solutions on website. But I could not solve this problem. What I tried is […]

Categories
Development HTML

TS2339: Property ‘xxxx’ does not exist on type ‘HTMLElement’

Meet this issue when I operate the DOM elements in Typescript. I tried the most answered way on stackoverflow: let ele: HTMLImageElement = document.getElementById(“img”) as HTMLImageElement But still get the error message when compile: Not sure why? Is my Typescript configuration wrong? { “compilerOptions”: { “outDir”: “./dist/”, “sourceMap”: true, “lib”: [“es5”, “es6”, “dom”], “alwaysStrict”: true, […]

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 […]