DEV Community

Discussion on: Writing test in Nuxt project

View post

Replies for: If your API changes, you probably want's to know what components you have to change, You can write that's kind of tests for that (it's call Contra...

Collapse
 
arishojaei profile image
Arman Shojaei • • Edited

The API is GraphQL and created with Php/Laravel. I use typescript in my Nuxt project, does it help to write less test? if yes, could you explain how, please?

Collapse
 
benjioe profile image
Benjioe • • Edited

I will write a post with a full explain, but in short :

  1. You generate TypeScript typing from GraphQL using tools.
  2. Add/Replace the result files in your client project.
  3. Type your fetch's result with generated files. 
// Generated
type dataType = {
  field: string;
};

async function fetchData(): Promise<dataType> {
  const fetchResult = await fetch("dataUrl");
  const json = await fetchResult.json();

  return json as dataType;
}

async function testIt() {
  const res = await fetchData();
  console.log(res.field); // get a typescript error if field no more in dataType
}
Enter fullscreen mode Exit fullscreen mode

Each time you update your API, make the 2 first step. If there is changes, you're client won't compile (if he use an out of date field).