miragejs / examples

Mirage JS

A client-side server to develop, test and prototype your JavaScript app.

Documentation

Visit miragejs.com to read the docs.

examples's Issues

Mirage in nextjs _app file integration breaks

In the latest version of Nextjs if you follow your app wide integration tutorial, it breaks.

The page one works.

react-typescript example has the same data for each person

Reproduction steps:

• Clone down the examples repo
• cd react-typescript; yarn; yarn start
• Open it up

I'm guessing this is because it uses property getters, and mirage might be caching those, because it thinks they're normal properties?

Factory create duplicates in react-typescript exemple

Hi,
I was looking around in the example files to get a better understanding on how to get type-safe factories, and realized that the factory in the react-typescript always creates the same object.

I was expecting :

server.createList("person", 20);

to create 20 unique Person objects, but it creates 20 identical ones.

Is this expected ?
Modifying the factory to use regular functions instead of getters works, but I'm a bit confused about how to type it properly.

Typescript example without

Need Help on schema.data.find()

Hi there,

I was trying to get some dummy data based on the id via miragejs mock API. Below is the mock server code

import {Server, Model} from "miragejs"
export function makeServer({ environment = "development" } = {}) {
    let server = new Server({
        urlPrefix: "http://localhost:8000/mockservice/api",
        namespace: "",
        models: {
          onlineperiod: Model
        },

        seeds(server) {
          server.create("onlineperiod",{id: 1, onlineperiodfrom: "10/01/2022",onlineperiodto: "16/02/2022"})
          server.create("onlineperiod",{id: 2, onlineperiodfrom: "10/02/2022",onlineperiodto: "16/03/2022"})
          server.create("onlineperiod",{id: 3, onlineperiodfrom: "10/03/2022",onlineperiodto: "16/04/2022"})
          server.create("onlineperiod",{id: 4, onlineperiodfrom: "10/04/2022",onlineperiodto: "16/05/2022"})
          server.create("onlineperiod",{id: 5, onlineperiodfrom: "10/05/2022",onlineperiodto: "16/06/2022"})
      },

        routes() {
            this.get("/request/requestPriorities", () => ({
                priorities: [
                  { id: 1, name: "Min" },
                  { id: 2, name: "Low" },
                  { id: 3, name: "Normal" },
                  { id: 4, name: "High" },
                  { id: 5, name: "Max" },
                ],
              }))

              this.get("/request/onlineperiod", (schema, request) => {
                let id=1;
                return schema.onlineperiod.find(id);
              })

              
        },
    });
    return server;
}

I am able to get data via accessing "/request/requestPriorities" but when I am accessing "/request/onlineperiod", I am getting 500 error saying "Cannot read properties of undefined (reading 'find')". Can anyone please let me know what I am doing wrong here?
Thanks in advance.

gatsby exemple!!

Hello guys. I'm having trouble implementing miragejs in my gatsby project. I would very much like you to have an example about. thnxx

How to read cookies inside request

I would like to simulate an environment in which authentication works through a JSESSIONID stored in a cookie.
Is it possible, with mirage, reading cookies sent in the request by the browser?
Thanx!

Typescript example without Faker

How can we have typescript support in the basic example show in the docs?

import { createServer, Model } from "miragejs"

export function makeServer({ environment = "development" } = {}) {
  let server = createServer({
    environment,

    models: {
      user: Model,
    },

    seeds(server) {
      server.create("user", { name: "Bob" })
      server.create("user", { name: "Alice" })
    },

    routes() {
      this.namespace = "api"

      this.get("/users", (schema) => {
        return schema.users.all()
      })
    },
  })

  return server
}
´´´

when I tried to set the Model it doesn.t seems to be working.. 

![image](https://github.com/miragejs/examples/assets/12377432/a34b4166-a3dc-44d5-909a-8f8497569c9c)