cryrivers / manta-style

🚀 The futuristic API Mock Server for Frontend

🚀 The futuristic API Mock Server for Frontend

---

✨ UPDATE:

While Manta Style is designed to be a mock server that converts type definitions into mock data. The core of Manta Style compiles definitions and makes them usable at JavaScript runtime. The runtime also supports input formatting and validation other than mocking data.

For more tools built with Manta Style core runtime, please check out Tools.

---

Check out the Quick Start page for a quick overview.

• Installation
• Quick Start
• Examples (Recommended)
• Usage
• Plugins

Motivation

Manta Style generates "real" (enough) mock data from your type definitions.

With Manta Style, you can start implementing feature once your data schema is defined. But Manta Style is more than just that.

Generates mock data directly from your type declarations

Manta Style officially supports TypeScript and Flow at the moment.

Mock data with respect to real world scenario such as past dates, addresses, names

interface User {
  /**
   * @faker {{internet.userName}}
   */
  userName: string; // Amina.Langosh49

  /**
   * @faker date.past
   */
  birthday: number; // 1529370938452

  /**
   * @example Croatia
   */
  country: string; // Croatia
}

Mock conditions specific to your type definitions

type WithResponseSuccess<T> = {
  status: 'ok';
  data: T;
};

type WithResponseFailure = {
  status: 'error';
  /**
   * @example Bad Request
   */
  message: string;
};

type WithResponse<T> = WithResponseSuccess<T> | WithResponseFailure;

Manta Style will generate either the error case or the normal case according to your declarations. Already have your list of error conditions and messages well-defined with your back end? You are in the luck! Manta Style will generate those cases for you just like in real world.

This also gives us one more motivation to fine-tune the typing to our codebase.

Fix a test case like a snapshot.

Implementing boundary cases has been hair pulling. With Manta Style you can supply a snapshot and have it returned every time until you finish.

... and more

Need more feature? Create an issue and let us know how Manta Style can help you.

Contributing

Getting Started

npm install
npm run bootstrap
npm run build

Tools

• Magic Type, a CLI tool that compiles TypeScript definitions to type objects runnable at JavaScript runtime.

Acknowledgments

• Zhongliang Wang for original idea, architecture design, initial implementation of runtime and transformers.
• Tan Li Hau for the design and implementation of selective mocking, plugin system, FlowType support and many official plugins.
• Jennie Ji for implementation of live-reload feature.
• Wei Gao for brilliant documentation.

License

Manta Style is MIT licensed

manta-style's Issues

Explain the meaning of Manta Style

tl;dr Manta Style = Cloak and really fucking awesome dagger

Manta Style stems from the Spanish fighting style Cloak and Dagger. Both work to disguise the true motives of the attacker while in plain sight.

Original Reference: https://dota2.gamepedia.com/Manta_Style

[suggestion] build manta-style code into memory

Can we build manta-style code into memory and eval it in memory instead of build code into .mantastyle-tmp?

Deprecate `flowtype-helpers-type` and `typescript-helpers-type`

@tanhauhau

I feel the data in those packages is very unlikely to be shared. So could we make test-helper extract those information into flowtype-helpers and typescript-helpers directly and remove those packages?

Search and choose plugins from CLI

would be great if we have search feature and choose plugin to install from the table

Address the issue in #57

Support intersection types

Testing for Runtime and Transformer

Playground for Manta Style

Playground web app for Manta Style

Support compiling decorator meta data emitted by TypeScript

As the title says.

Documentation and overhaul of README.md

• Documentation
• README.md
• Playground (#51)

Snapshot generation for all endpoints / scenario (different combination of conditional types)

[discussion] Create OpenCollective account for the project?

Create a open collective account for the project?
@Cryrivers

Release Notes?

Save the configuration of selective mocking

Is your feature request related to a problem? Please describe.

looks good, but can we do it further, save the configuration somewhere? It might be troublesome if someday there are a lot of API mocking available but you only need to test some of them

• Jennie (2018)

Describe the solution you'd like
A potential solution is saving those configuration into snapshots. So we don't have to add more command line option or new mechanism for users to learn.

Describe alternatives you've considered
N/A

Additional context
N/A

Support to read request params

Mock image(s) of specific dimensions

Is your feature request related to a problem? Please describe.
So that some image fields we can get an image of a right size.

Describe the solution you'd like

/**
 * @image ${keyword to search}
 * @width  ${width}
 * @height ${height}
 */
imageUrl: string;

Describe alternatives you've considered
N/A

Additional context
N/A

RFC: Rethink Annotations

tl;dr: this probably a Milestone for 2.0, for 1.0 we will still keep the current mechanism and specification, but re-design the API to be forward-compatible.

This issue is about normalizing JSDoc annotation and powerful Handlebars annotation. And we aim to achieve following goals:

• Parse and execute Handlebar annotation under the hood, convert JSDoc annotation into handlebars annotation. For example:

/**
 * @iterate hello
 * @iterate world
 * @example a
 * @example b
 */

converts to (in practice, AnnotationNode would be constructed directly, without involving handlebars conversion):

/**
 * @mantastyle
 * {{iterate 'hello' 'world'}}
 * {{example 'a' 'b'}}
 */

• Other than JSDoc, users can opt-in undocumented and powerful handlebars annotation by having @mantastyle in their comment. So a parsed annotation always starts with AnnotationNode[]

This could also unify JSDoc annotation and handlebar annotation, and also make previous annotationUtils compatible with new implementation.

• Re-implement annotation generation logic by evaluating Handlebars under-the-hood, and the evaluation can be either lazy or eager as well. Subgoals would be:
  • Change signature of mock plugins from Annotation[] => any to AnnotationExpression => AnnotationNode.
  • Evaluation is lazy by default, (there should be a way to eagerly evaluate sub-expressions)
  • The evaluation order should respect to the evaluation order of type nodes. For example:

/**
* @mantastyle
* {{faker 'internet.UserName'}}
* {{length (range min=5 max=10)}}
*/
type Test = string[];

As deriveLiteral in ArrayType runs first, then in StringType. So {{length}} runs first, then {{faker}} (probably runs multiple times depending on {{length}}, accordingly.

• Build in some annotation plugins by default
  • {{key [string]}} to manipulate keys of object
  • {{length [number]}} to manipulate length of array
  • {{range min= max= precision=}} to generate a random number given range

Help Wanted: Design a logo for manta-style

@manta-style node API

Decouple API and the CLI.
Suggesting API

class MantaStyle {
   constructor(configPath: string){}
   // run manta style server
   run(callback) {}
   // run manta style server + watch config hot reload
   watch(callback) {}

   // snapshot api
   setSnapshot() {}
   getSnapshot() {}

   // proxy api
   setProxy() {}

   // mock api
   mockEndpoint() {}
   unmockEndpoint() {}
}

Snapshot hot swapping

Purposed Syntax, not finalized yet.

import ms from '@manta-style/test-helper';

describe('test', () => {
  beforeAll(async () => {
    await ms.setup('path/to/configFile.ts');
  });
  afterAll(async () => {
    await ms.teardown();
  });
  test('some test', async () => {
    await ms.loadSnapshot('path/to/successSnapshot.json');
    // Test cases for success response...
    await ms.loadSnapshot('path/to/failureSnapshot.json');
    // Test cases for failure response...
  });
});

Fake data type use TS type instead of comment?

Selective API Proxying with snapshot support

Need to install globally?

I installed

npm install --save-dev @manta-style/cli @manta-style/plugin-builder-typescript @manta-style/plugin-mock-example

to project only and it doesn't work.
Reports no ms command found.
I had to install the cli globally for it to work.

Support built-in type helpers in TypeScript

Config hot reloading

Generate type declarations at correct places

As the title says. I'll elaborate later.

Road to v1.0

Manta Style Limitations

• extends keyword in interface declaration will be ignored

interface A extends B {
  key: string;
}

• Intersection type is not supported yet

type A = B & { key: string };

• Built-in type helpers like Exclude and Extract are not supported yet

Unimplemented Features

• Support to read request params
• Snapshot generation for all endpoints / scenario (different combination of conditional types)
• Snapshot hot swapping
• Config hot reloading
• Selective API Mocking
• Selective API Proxying with snapshot support

Considered

• Validation features (given up)
• Integration to JSONServer
• Babel + Flow transformers and builders
• Doc site generation

Try adopting lazy-jest

Try adopting lazy-jest by @JennieJi

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on Greenkeeper branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please click the 'fix repo' button on account.greenkeeper.io.

Capability to validate payload

As the title says.

We are going a build an ambitious BE/FE collaboration flow / toolchain which depends on this feature. Stay tuned!

Selective API Mocking

GraphQL Support

Support GraphQL schemas and types

Flow Support

This issue is used to track the Flow Type support in manta-style

---

• Flow Type Syntax

  • $Keys
  • $Values
  • $PropertyType
  • $Shape<T>
  • $ReadOnly<T>
  • $Exact<T>
  • $Diff<A, B>
  • $Rest<A, B>
  • $NonMaybeType<T>
  • Array<T>
  • Existential Type (*)
  • Opaque Types
  • Function Types
    • $ObjMap
    • $TupleMap
    • $Call

• Flow Files dependency resolver - this is to transform not just the config file, but also the dependencies of config file. this is done automatically by typescript compiler but not flow babel transformer