Automatic Mocking with Fake Data using Falso
Falso is a popular javascript library that provides mocking functions for a variety of types of data across different domains. Using the Falso middleware with graphql-mocks makes it easy to get a fully mocked GraphQL API quickly. This is useful when some data should be mocked concretely, but the other fields can be generated.
This middleware was adapted from the Faker.js middleware (@graphql-mocks/faker
) which has since been deprecated. Since Faker.js is no longer maintained and Falso is a modern esmodule-first alternative Falso is being used instead. If previously using the Faker.js middleware see Migrating from the Faker Middleware section below.
The middleware includes support for:
- choosing random GraphQL enum values
- finding an appropriate Falso function for a field (ie: a
firstName
field would use the appropriate Falso function (randFirstName
)) - randomly including
null
values for nullable fields - specifying the Falso fn to be used for a field
- specifying ranges of results used for lists
- applying handling to specific resolvers using
highlight
API Documentation
Installation
Install @graphql-mocks/falso
and @ngneat/falso
(and the main graphql-mocks
package if not already installed).
# npm
npm install --save-dev @ngneat/falso @graphql-mocks/falso graphql-mocks
# yarn
yarn add --dev @ngneat/falso @graphql-mocks/falso graphql-mocks
# pnpm
pnpm add --save-dev @ngneat/falso @graphql-mocks/falso graphql-mocks
Usage
Call falsoMiddleware
and pass the result to the middlewares
option on the graphql-mocks GraphQLHandler
and the entire resolver map will be mocked and is ready for querying. To apply resolvers only to specific parts of the GraphQL Schema use the highlight
option (details below).
import { GraphQLHandler } from 'graphql-mocks';
import { falsoMiddleware } from '@graphql-mocks/falso';
const handler = new GraphQLHandler({
middlewares: [falsoMiddleware()],
dependencies: {
graphqlSchema,
},
});
Middleware options
For finer control of Falso the middleware can be configured with an options objects, see the following sections for more information on each option.
falsoMiddleware({
replace: true,
highlight: (h) => h.include(['Person', 'name']);
fields: {
type: {
field: {
falsoFn: 'address.city',
possibleValues: [],
}
}
}
})
Use a specific Falso function per field
Available functions are listed in the Falso documentation.
If the highlight
option is also specified, make sure the highlight includes the specified type and field names so that the Falso function is included.
type Person {
favoriteCity: String!
}
To specify the Person.favoriteCity
to use the randCity
falso function:
falsoMiddleware({
fields: {
Person: {
favoriteCity: {
falsoFn: 'randCity'
}
}
}
})
Specifying possible values per field
type Person {
name: String!
}
Specify the possible values for Person.name
and one will be selected at random. If the highlight
option is also specified, make sure the highlight includes the specified type and field names that the possibleValues
are specified for.
falsoMiddleware({
fields: {
Person: {
name: {
possibleValues: ['Lisa', 'Marge', 'Maggie', 'Bart', 'Homer']
}
}
}
})
Specify chance of null values for nullable fields
- Default:
0.1
(10%)
The chance a nullable field is null, or that a list contains null, can be controlled by the nullPercentage
and nullListPercentage
options respectively. These can be specified globally for all fields and for a specific field.
Globally, for all fields:
falsoMiddleware({
nullPercentage: 0.5,
nullListPercentage: 0.7
})
For a specific field, in this case the null probability for Person.name
:
falsoMiddleware({
fields: {
Person: {
name: {
nullPercentage: 0.5,
nullListPercentage: 0.7
}
}
}
})
Specifying the range of items in a list
- Default: min: 0, max: 10
A list can be configured to have a min/max range.
This can be specified globally:
falsoMiddleware({
listCount: { min: 2, max: 20 }
})
or for a specific field, in this case for the list of pets on Person.pets
:
type Person {
pets: [Pet!]!
}
falsoMiddleware({
fields: {
Person: {
pets: {
listCount: { min: 2, max: 20 }
}
}
}
})
Replace existing resolver functions
- Default:
false
If there is a need to replace existing resolver functions in the resolver map with falso functions then pass true
for the replace
option.
falsoMiddleware({
replace: true
})
Highlight specific resolvers to include
- Default: Resolver functions for the entire schema are included (and only replaces existing resolver based on the
replace
option which defaults tofalse
).
The highlight
option controls which parts of Resolver Map are modified by the falso middleware. This is a common pattern for graphql-mocks middlewares, see the highlight
option documentation for more information.
Migrating from Faker.js to the Falso Middleware
Faker.js is no longer maintained and Falso is a modern alternative. If faker and @graphql-mocks/faker
were previously being used then migrating to @graphql-mocks/falso
should be relatively quick.
- Remove
faker
and@graphql-mocks/faker
#npm
npm remove faker @graphql-mocks/faker
# yarn
yarn remove faker @graphql-mocks/faker
# pnpm
pnpm remove faker @graphql-mocks/faker
- Install Falso and
@graphql-mocks/falso
#npm
npm install --save-dev @ngneat/falso @graphql-mocks/falso
# yarn
yarn add --dev @ngneat/falso @graphql-mocks/falso
# pnpm
pnpm add --save-dev @ngneat/falso @graphql-mocks/falso
- Update require/imports
ES Modules:
// from
import { fakerMiddleware } from '@graphql-mocks/faker';
// to
import { falsoMiddleware } from '@graphql-mocks/falso';
CommonJS Modules:
// from
const { fakerMiddleware } = require('@graphql-mocks/faker');
// to
const { falsoMiddleware } = require('@graphql-mocks/falso');
- Update Middleware Options
Update fakerFn
options to falsoFn
and the corresponding function to the Falso equivalent
// from
fakerMiddleware({
fields: {
Person: {
favoriteCity: {
fakerFn: 'address.city'
}
}
}
}
// to
falsoMiddleware({
fields: {
Person: {
favoriteCity: {
// `fakerFn` -> `falsoFn`
// `address.city` from Faker -> `randCity` from Falso
falsoFn: 'randCity'
}
}
}
}