Comments (19)
@tiljanssen @syffs @essensx I don't write typescript. I would really welcome a pull request to implement the types. If you have the time it'd be a great way to give back to open source
from fetch-mock-jest.
Any progress on this issue?
from fetch-mock-jest.
@alexb-uk Are you able to share any more information about those errors
Sorry got distracted and forgot to write an update. I fixed the test error but never managed to get import
working. I was hoping the following would work but when you run the test it throws an undefined
error:
import fetchMockJest from 'fetch-mock-jest';
const fetchMock = fetchMockJest.sandbox();
// Produces: TypeError: Cannot read property 'sandbox' of undefined
So I've switched back to require
. At the very top of the test file before any import
statements:
const fetchMock = require('fetch-mock-jest').sandbox();
jest.mock('node-fetch', () => {
const nodeFetch = jest.requireActual('node-fetch');
Object.assign(fetchMock.config, {
fetch: nodeFetch,
});
return { ...nodeFetch, default: fetchMock };
});
This makes typings auto-complete in Webstorm IDE but are not working in the TypeScript compiler 😞
For example get()
auto-completes with arg names and IDE warning of bad types BUT I would expect a TSXXXX error. Also incorrect properties are not flagged.
I have also switched from @types/global.d.ts
to @types/jest.d.ts
and declare global inside the file:
import { InspectionFilter, InspectionOptions } from 'fetch-mock';
declare global {
namespace jest {
interface Matchers<R> {
toHaveFetched(filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveLastFetched(filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveNthFetched(n: number, filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveFetchedTimes(times: number, filter?: InspectionFilter, options?: InspectionOptions): R;
toBeDone(filter?: InspectionFilter): R;
}
}
}
Give me a shout if I can shed any more light.
I'll have another go with a fresh head and see if I can get it working fully.
from fetch-mock-jest.
I’ve made a pull request based on the types here and tested it on a few projects: #23
from fetch-mock-jest.
It would help if the TypeScript setup was documented now that it's supported. This is what I was able to figure out on my own:
const fetchMock: typeof fetchMockJest = require('isomorphic-fetch')
from fetch-mock-jest.
Also, any comparisons between this library and jest-fetch-mock would be much appreciated :)
from fetch-mock-jest.
I've just added the following declarations for now in my project, which seem to work fine though I'm not totally sure if they are correct:
declare module "fetch-mock-jest" {
import { FetchMockStatic, MockCall, FetchMockSandbox } from "fetch-mock";
interface FetchMockJestSandbox {
sandbox(): jest.MockInstance<Response, MockCall> & FetchMockSandbox;
}
export type FetchMockJest = jest.MockInstance<Response, MockCall> &
FetchMockJestSandbox &
FetchMockStatic;
const fetchMockJest: FetchMockJest;
export default fetchMockJest;
}
declare namespace jest {
import { InspectionFilter, InspectionOptions } from "fetch-mock";
interface Matchers<R, T> {
toHaveFetched(filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveLastFetched(
filter?: InspectionFilter,
options?: InspectionOptions
): R;
toHaveNthFetched(
n: number,
filter?: InspectionFilter,
options?: InspectionOptions
): R;
toHaveFetchedTimes(
times: number,
filter?: InspectionFilter,
options?: InspectionOptions
): R;
toBeDone(filter?: InspectionFilter): R;
}
}
Happy to work on a PR after I've battle tested them a little more.
from fetch-mock-jest.
@mdlawson I don't know typescript very well, but the fetch-mock-jest api isn't very big, so you're probably pretty close. Could do with tslint tests for the PR though. Thanks for starting work on it.
@sadsa By comparisons you mean some sort of feature by feature comparison table?
from fetch-mock-jest.
@wheresrhys - Well, I haven't had enough exposure to the library yet but from a quick visit to the documentation for this project, it's pretty lacking so far. It took me awhile to see that fetch-mock actually has quiet a full set of docs (http://www.wheresrhys.co.uk/fetch-mock/). Either a feature list at the top of the readme or a clear link through to the fetch-mock docs would be nice.
from fetch-mock-jest.
@mdlawson - If you could make a PR for this, that would be awesome. Also, what version of Typescript are you using? as I see an Import declarations in a namespace cannot reference a module.ts(1147)
error
from fetch-mock-jest.
Thanks for the feedback - I'll try to make that clearer
from fetch-mock-jest.
@sadsa Let me know what you think of the readme now
from fetch-mock-jest.
FYI I used the following definitions to get this working on:
- "fetch-mock": "^9.2.1"
- "fetch-mock-jest": "^1.2.4"
- "jest": "^25.1.0"
- "ts-jest": "25.2.1"
- "typescript": "3.8.3"
/@types/fetch-mock-jest/index.d.ts
:
declare module 'fetch-mock-jest' {
import { FetchMockStatic, MockCall, FetchMockSandbox } from 'fetch-mock';
interface FetchMockJestSandbox {
sandbox(): jest.MockInstance<Response, MockCall> & FetchMockSandbox;
}
export type FetchMockJest = jest.MockInstance<Response, MockCall> & FetchMockJestSandbox & FetchMockStatic;
const fetchMockJest: FetchMockJest;
export default fetchMockJest;
}
/@types/global.d.ts
:
import { InspectionFilter, InspectionOptions } from 'fetch-mock';
declare namespace jest {
interface Matchers<R> {
toHaveFetched(filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveLastFetched(filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveNthFetched(n: number, filter?: InspectionFilter, options?: InspectionOptions): R;
toHaveFetchedTimes(times: number, filter?: InspectionFilter, options?: InspectionOptions): R;
toBeDone(filter?: InspectionFilter): R;
}
}
For reference my type roots are defined in tsconfig.json
as:
"typeRoots": ["./src/@types", "node_modules/@types"]
you may need to adjust according to your project layout.
Once I've done some proper testing and if all goes to plan I'll put up a PR.
HTH
UPDATE: Although I thought this was working I'm getting weird errors when running the entire test suite vs a single test so something still not quite right.
from fetch-mock-jest.
@alexb-uk Are you able to share any more information about those errors
from fetch-mock-jest.
Thanks for persevering. I wish I could help, but have next to zero knowledge of typescript
@grug Hello, and welcome to the jest wrapper. Having some trouble with types over here. I wonder if you're able to shed any light?
from fetch-mock-jest.
🙌 @skovhus
from fetch-mock-jest.
@wheresrhys when do you plan to make a new release on npm? I guess this issue should stay open until it has been released. :)
from fetch-mock-jest.
failing build - will debug now
from fetch-mock-jest.
Released as 1.5.1
from fetch-mock-jest.
Related Issues (20)
- TypeError: debug is not a function HOT 6
- `fetchMock.mock.calls` never updates (possibly jest 26) HOT 4
- Make it so that fetch lifecycle methods affect the jest mock
- Simplify implementation HOT 1
- Keep getting Unmatched GET to "http://example.com" HOT 2
- `headers` are not matched strictly
- sandbox() has the wrong type definition
- Verbs ended inspection methods are not available in Typescript.
- TypeError: Cannot read property 'post' of undefined HOT 1
- 1th call to fetch should have had a URL of ... but was undefined
- No fallback response defined for GET to /foo HOT 1
- TypeError: Cannot read property 'bind' of undefined
- expect fetchMock.lastCall('filter')).toequal bad comparison? HOT 1
- `expect(fetch).toHaveBeenCalledWith(<url>)` doesn't work because it also receives undefined as second argument HOT 1
- How to ignore FormData?
- when using delay and jest modern fakeTimers it seems to be using a real delay HOT 1
- Feature request: Treat warnings as errors
- Conflict with `bottleneck` library? HOT 1
- How to use fetch-mock-jest with Typescript? HOT 1
- Error message when the body of toHaveFetched has a mismatch HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fetch-mock-jest.