Questions tagged [miragejs]
The miragejs tag has no usage guidance.
51
questions
0
votes
0
answers
29
views
What domain name should we use with this.passthrough() in mirage js to enable API call to cloud Firestore?
I am trying to make an API call to my data in cloud Firestore but I have mirage js, too. Now I am getting error where the backend doesn't respond to my call.
This one is not working:
this.passthrough(&...
0
votes
0
answers
67
views
Setup MirajeJS on NextTS 13 with the app directory
I would like to implement MirageJS on my NextTS version 13 application (with the new app folder), but I can't find anyone who has already done this.
Can anyone give me some pointers?
// layout.tsx
...
0
votes
0
answers
62
views
Getting 404s when trying to mock with mirageJs in a NextJs with App Router
My issue here most likely happens since I am not instantiating the mock server in the correct place in my app. The mirageJs docs are still catered to the old 'pages router', where it says:
Open your ...
0
votes
4
answers
153
views
MirageJs does not throw status 400
I am new to react and I'm working on react fetch using useEffect.
Im using miragejs to mimic an api server. I am testing the sad path and have made the miragejs API to return a 400 status code.
im ...
0
votes
0
answers
25
views
MirageJS GraphQL resolver returning empty list despite being called
I'm using Mirage.js to mock my GraphQL API, but I'm encountering an issue with my resolver. Although I can see that the resolver is being called (console.log statements are executed), the response I ...
-1
votes
3
answers
391
views
Issue with redirect React Router 6 and MirageJS. Why is my redirect throwing this error?
I'm currently building the Vanlife app for my https://scrimba.com/learn/reactrouter6 React Router 6 course on Scrimba and I've ran into an interesting issue (same as this user actually https://www....
-1
votes
1
answer
2k
views
67:1 Uncaught (in promise) SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON P
I'm doing a tutorial from scrimba for react and react router 6 and I'm encountering an error with the provided data. The error says 67:1 Uncaught (in promise) SyntaxError: Unexpected token '<', &...
0
votes
0
answers
41
views
can we use websocket with miragejs in vuejs3 app?
I have to use websocket with mocking library miragejs for vuejs3 app.
I have created websocket server and connection but didnot understand how to use miragejs server along with websocket server
1
vote
0
answers
147
views
Is it possible to see the response of a API call from Mirage JS in browser without calling it from code?
Here is the server creation :
import { createServer } from "miragejs"
export default function () {
createServer({
routes() {
this.get("/api/reminders", () => ({
...
3
votes
0
answers
143
views
Typescript error on afterCreate in miragejs
I have the following code for my factory, omitting some properties for brevity.
export const propsPlayerDetailFactory = Factory.extend({
sportId: () => getFakeSportId(),
playerId: i => `${i}`...
1
vote
2
answers
921
views
Mirage/Pretender causes errors in Vitest
I'm working on migrating from Jest to Vitest (alongside CRA > Vite migration), and I think I've got everything working, except that using Mirage causes errors. Setting the vite config test ...
1
vote
1
answer
513
views
MirageJS Error response not causing an error
Following the docs I've set up this handler inside routes():
this.put(
'/admin/features/error/environment/test',
// @ts-ignore
() => new Response(500, {}, { errors: ['The database went on ...
0
votes
0
answers
366
views
Unable to mock API request using miragejs in ReactNative Typescript because window is not defined
I am building a mobile application using ReactNative. My app is interacting with an API. I am trying to mock the API requests using Mirage JS when I am building the app locally following this link, ...
0
votes
1
answer
1k
views
Is there a type for Mirage.js's schema when working with Typescript
Am using mirage.js to mock an API that's not complete using typescript in strict mode. I am having trouble with the schema type in the routes() method.
It works, I just want to avoid the warning that ...
3
votes
0
answers
142
views
Add meta data to ember js mirage data
I am working in an ember-cli project which has Mirage already set up for testing. It may be an older version, miragejs: ^0.1.44 and ember-cli-mirage: ^2.4.0
I have added a feature that relies on data ...
1
vote
0
answers
3k
views
Redux Toolkit RTK fetchBasedQuery.prepareHeaders not working on the first call
I have this apiSlice:
export const apiSlice = createApi({
baseQuery: fetchBaseQuery({
baseUrl: `${baseUrl}${apiBasePath}`,
prepareHeaders: prepHeaders,
}),
endpoints: (builder) => ({
...
1
vote
1
answer
610
views
How to handle FormData in Miragejs?
Miragejs handles json out-of-the-box but seems to be unable to handle FormData. When I post FormData and log the received request in mirage endpoint, request.requestBody is empty.
Simplified code ...
2
votes
0
answers
241
views
MirageJS - How Do You Add "blob://http://localhost" To Whitelist / Passthrough?
I have functionality that takes a local base64 URL for an image and converts it to actual base64 data. To do this, I have to call fetch(), followed by an initialization of new FileReader().
When the ...
1
vote
1
answer
292
views
How to expand a single cell of a table to show additional JSON data in React
On my app I have a table that lists the names of employees, and I am currently able to click an "EXPAND ALL" button to display additional info for every employee at once. I am trying to ...
0
votes
1
answer
5k
views
React: Uncaught TypeError: Cannot destructure property 'id' of '_ref' as it is undefined
Been trying to figure this out for a couple hours now but I'm stumped. According to the console, when I make a patch request, the request goes through and actually updates the information, but my map ...
0
votes
2
answers
764
views
Mirage JS json data is console logging but not rendering on the page in React
I am working on a coding assessment and running into a problem when it comes to rendering dummy data from Mirage JS on my page. When I console log the data I'm looking for it shows up fine in the ...
0
votes
1
answer
285
views
React native with Axios - post method with body returns timeout
I am attempting to create a miragejs server with a post request but am receiving a timeout every time I make a call. Strangely get/delete endpoints return fine but post/put endpoints hang indefinitely ...
3
votes
0
answers
125
views
MirageJS - Whitelist / Pass Through All XHR Endpoints By Default
Out of the box, you have to specifically tell MirageJS which endpoints to mock out and which endpoints to pass through. If your app calls an endpoint that isn't targeted in Mirage's createServer() ...
2
votes
0
answers
380
views
Using MirageJS with NextJS API route
I want to call an external API from the api folder from Next.js. I want to call it on server side because the client should not see what URL is called. In the dev environment I use a Mirage server to ...
1
vote
1
answer
336
views
How to change id field in miragejs db
I am wondering how I could change the default, generated id column for a mirage db from 'id' to something like 'userId' as my front end expects.
Thanks!
0
votes
1
answer
124
views
Serialize MirageJS response to fit EF Core API type List<>
I am trying to mock my EF Core API using Mirage but cannot figure out how to serialize my output. The front end is expecting something like:
[{id:1, name:"name1", weight: 150}, {id:2, name:&...
1
vote
0
answers
303
views
Mirage JS add pagination data to response
I have a problem with mocking backend by mirage JS. How to add pagination data to response after creatList?
My server js returns JSON
https://miragejs.com/repl/v2/6563736c78
{
"users": [
...
9
votes
2
answers
3k
views
MirageJs: cannot use axios if I call api with passthrough
I have an app in react with a slice and a thunk.
I use @reduxjs/toolkit and I created slice with "createSlice" api and thunk with "createAsyncThunk".
My thunk:
export const ...
2
votes
1
answer
1k
views
How to intentionally make all Mirage JS request return 500?
Trying to make MULTIPLE mocked service response 500 for testing any suggestions?
0
votes
1
answer
836
views
TypeScript, Vue, and MirageJS: Problems with TS compile errors
The problem: I am required to use Vue and MirageJS in a TypeScript web app, and in that web app, I get TS compile errors.
The code:
import { Server, Model } from 'miragejs'
export function makeServer({...
2
votes
0
answers
601
views
Mocking APIs in End to End Testing with Detox and React-Native
Has anyone been able to mock APIs in React-Native when doing end to end testing with Detox.
I tried using MirageJs. I am able to mock the APIs after creating a server with MirageJs and initializing it ...
0
votes
1
answer
281
views
How to call mirage server before application starts in StencilJS
I am working on a StencilJS project where I have to use MirageJS to make fake API data.
How to call server before StencilJS application loads.
In react we can call makeServer() in the index.ts file, ...
4
votes
2
answers
552
views
Using the LocalStorage API to persist the Miragejs db
While reading the docs for miragejs, on this page, it says:
Mirage resets its state on every browser reload, which can be a double-edged sword but is often what you want for development and testing. (...
0
votes
1
answer
231
views
How to redirect MirajeJS to a real request if there is no such route in mocks?
With the help of mirajeJS, we can simulate routes, but is it possible, if such a route is not simulated in mirajeJS, to redirect it and use a real server using axios?
import {Server} from "...
3
votes
1
answer
173
views
How make request to MirajeJS js only when I need it
I have a fake server created with mirajeJs. All my requests are trying to contact him, how can I make a request for mirajeJs only in cases when I need it while making the rest of the requests to the ...
3
votes
1
answer
490
views
Miragejs: Unable to load the ionic icons - data:image/svg+xml
Getting below error in the browser console and the icons are not getting rendered.
Object { description: "Mirage: undefined", fileName: "http://localhost:8100/js/chunk-vendors.js line ...
1
vote
0
answers
59
views
How should I embed 2 models with a many-to-many relationship?
I have two models with a many-to-many relationship:
Blog
Tag
So each blog has a tags property, and each tag has a blogs property.
I also have two API endpoints: /blogs and /tags
My problem is, if I ...
0
votes
1
answer
202
views
miragejs '[WDS] Disconnected!' instantly
If I createServer with miragejs, WDS (Webpack Dev Server) get disconnected.
if I disable mirages mock server, WDS works I expected.
Here is full call stack of [WDS] Disconnected!
src/index.tsx
...
1
vote
1
answer
494
views
How can I embed child data with many-to-many relationships?
I have two Models in MirageJs:
blog
tag
Each blog could have more tags and vice versa. I made a many-to-many relationship with a join table called blog_tag. My problem is, when I get the response ...
0
votes
1
answer
80
views
how the data is destructured in this example?
im making a project diary App by follwing an article. it uses redux toolkit and miraj as a fake server.
it has a component named Editor
const Editor: FC = () => {
const { currentlyEditing: entry,...
2
votes
1
answer
2k
views
mirage.js multiple wildcard passthrough
Background
We are using miragejs to mock server apis.
Our server / backend, follows microservice architecture, and each microservice is versioned separately, and as a result and our api paths have
{...
0
votes
1
answer
731
views
How do you return an array of string ids using a factory in MirageJS?
In MirageJS I am trying to create a factory for a simple array model.
Current code
Here is my code:
let server = new Server({
models: {
usertab: Model
},
factories: {
...
3
votes
1
answer
340
views
Miragejs seeds function not called
I'm trying to set-up a miragejs server, but for some reason, the seeds function is not called. The other server function, routes, is called and the routes are mapped correctly.
export default function ...
2
votes
2
answers
634
views
How to seed models with polymorphic one to one relationship in mirage js?
this is just an example, I understand that you would normally have multiple comments, but for the sake of this example, lets assume that we have
following models:
models: {
blogPost: Model.extend(...
0
votes
1
answer
1k
views
createList does not pick up relationship in Mirage js
I am trying to create multiple posts that belong to a user using Mirage js createList facility. I have created models with corresponding relationships:
models: {
user: Model.extend({
...
2
votes
1
answer
2k
views
mirage.js will not work with sub url paths (only with root path) in angular
Mirage does match defined routes when the backend calls are performed through the root url (localhost:4200/), but when we perform a backend call on a sub page, e.a.: localhost:4200/process, it will ...
2
votes
0
answers
957
views
Detox with Mirage.js [Mock API Call] React-Native
I'm working on some tests using Detox for my React-Native application, one of those test is a flow where I need to check that the user's session is secured. If not, I'm sending an SMS Verification ...
4
votes
3
answers
1k
views
Convert all MirageJS ids to integers
MirageJS provides all model ids as strings. Our backend uses integers, which are convenient for sorting and so on. After reading around MirageJS does not support integer IDs out of the box. From the ...
2
votes
1
answer
529
views
Is there a way to show related model ids without sideloading or embedding data
My understanding is that using serializeIds: 'always' will give me this data, but it does not.
Here's what I'm expecting:
{
id="1"
title="some title"
customerId="2"
}
Instead the output I'm ...
1
vote
0
answers
443
views
MirageJS not persisting POST created data
I'm building this VueJS app with MirageJS to mock an API and I came up with this issue. I have a /users endpoint where it handles GET and POST requests. If data is created by a factory, it returns ...