feat(client, learn): add helper functions for common validation operations (#38605)

Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>
This commit is contained in:
Hassaan Pasha
2020-09-17 19:08:01 +05:00
committed by GitHub
parent aecbc28798
commit 80438cac3e
54 changed files with 326 additions and 157 deletions

View File

@@ -33,9 +33,10 @@ Make the promise handle success and failure. If <code>responseFromServer</code>
```yml
tests:
- text: <code>resolve</code> should be called with the expected string when the <code>if</code> condition is <code>true</code>.
testString: assert(removeJSComments(code).match(/if\s*\(\s*responseFromServer\s*\)\s*{\s*resolve\s*\(\s*('|"|`)We got the data\1\s*\)(\s*|\s*;\s*)}/g));
testString: assert(__helpers.removeJSComments(code).match(/if\s*\(\s*responseFromServer\s*\)\s*{\s*resolve\s*\(\s*('|"|`)We got the data\1\s*\)(\s*|\s*;\s*)}/g));
- text: <code>reject</code> should be called with the expected string when the <code>if</code> condition is <code>false</code>.
testString: assert(removeJSComments(code).match(/}\s*else\s*{\s*reject\s*\(\s*('|"|`)Data not received\1\s*\)(\s*|\s*;\s*)}/g));
testString: assert(__helpers.removeJSComments(code).match(/}\s*else\s*{\s*reject\s*\(\s*('|"|`)Data not received\1\s*\)(\s*|\s*;\s*)}/g));
```
</section>
@@ -59,14 +60,6 @@ const makeServerRequest = new Promise((resolve, reject) => {
</div>
### After Test
<div id='js-teardown'>
```js
const removeJSComments = str => str.replace(/\/\*[\s\S]*?\*\/|\/\/.*$/gm, '');
```
</div>
</section>
## Solution

View File

@@ -29,11 +29,11 @@ Add the <code>then</code> method to your promise. Use <code>result</code> as the
```yml
tests:
- text: You should call the <code>then</code> method on the promise.
testString: assert(codeWithoutSpaces.match(/(makeServerRequest|\))\.then\(/g));
testString: assert(__helpers.removeWhiteSpace(code).match(/(makeServerRequest|\))\.then\(/g));
- text: Your <code>then</code> method should have a callback function with <code>result</code> as its parameter.
testString: assert(resultIsParameter);
- text: You should log <code>result</code> to the console.
testString: assert(resultIsParameter && codeWithoutSpaces.match(/\.then\(.*?result.*?console.log\(result\).*?\)/));
testString: assert(resultIsParameter && __helpers.removeWhiteSpace(code).match(/\.then\(.*?result.*?console.log\(result\).*?\)/));
```
</section>
@@ -61,8 +61,7 @@ const makeServerRequest = new Promise((resolve, reject) => {
<div id='js-teardown'>
```js
const codeWithoutSpaces = code.replace(/\s/g, '');
const resultIsParameter = /\.then\((function\(result\){|result|\(result\)=>)/.test(codeWithoutSpaces);
const resultIsParameter = /\.then\((function\(result\){|result|\(result\)=>)/.test(__helpers.removeWhiteSpace(code));
```
</div>

View File

@@ -31,11 +31,11 @@ Add the <code>catch</code> method to your promise. Use <code>error</code> as the
```yml
tests:
- text: You should call the <code>catch</code> method on the promise.
testString: assert(codeWithoutSpaces.match(/(makeServerRequest|\))\.catch\(/g));
testString: assert(__helpers.removeWhiteSpace(code).match(/(makeServerRequest|\))\.catch\(/g));
- text: Your <code>catch</code> method should have a callback function with <code>error</code> as its parameter.
testString: assert(errorIsParameter);
- text: You should log <code>error</code> to the console.
testString: assert(errorIsParameter && codeWithoutSpaces.match(/\.catch\(.*?error.*?console.log\(error\).*?\)/));
testString: assert(errorIsParameter && __helpers.removeWhiteSpace(code).match(/\.catch\(.*?error.*?console.log\(error\).*?\)/));
```
</section>
@@ -67,8 +67,7 @@ makeServerRequest.then(result => {
<div id='js-teardown'>
```js
const codeWithoutSpaces = code.replace(/\s/g, '');
const errorIsParameter = /\.catch\((function\(error\){|error|\(error\)=>)/.test(codeWithoutSpaces);
const errorIsParameter = /\.catch\((function\(error\){|error|\(error\)=>)/.test(__helpers.removeWhiteSpace(code));
```
</div>

View File

@@ -41,11 +41,11 @@ Replace the two assignments with an equivalent destructuring assignment. It shou
```yml
tests:
- text: You should remove the ES5 assignment syntax.
testString: assert(!removeJSComments(code).match(/today\s*=\s*HIGH_TEMPERATURES\.(today|tomorrow)/g))
testString: assert(!__helpers.removeJSComments(code).match(/today\s*=\s*HIGH_TEMPERATURES\.(today|tomorrow)/g))
- text: You should use destructuring to create the <code>today</code> variable.
testString: assert(removeJSComments(code).match(/(var|let|const)\s*{\s*(today[^}]*|[^,]*,\s*today)\s*}\s*=\s*HIGH_TEMPERATURES(;|\s+|\/\/)/g));
testString: assert(__helpers.removeJSComments(code).match(/(var|let|const)\s*{\s*(today[^}]*|[^,]*,\s*today)\s*}\s*=\s*HIGH_TEMPERATURES(;|\s+|\/\/)/g));
- text: You should use destructuring to create the <code>tomorrow</code> variable.
testString: assert(removeJSComments(code).match(/(var|let|const)\s*{\s*(tomorrow[^}]*|[^,]*,\s*tomorrow)\s*}\s*=\s*HIGH_TEMPERATURES(;|\s+|\/\/)/g));
testString: assert(__helpers.removeJSComments(code).match(/(var|let|const)\s*{\s*(tomorrow[^}]*|[^,]*,\s*tomorrow)\s*}\s*=\s*HIGH_TEMPERATURES(;|\s+|\/\/)/g));
- text: <code>today</code> should be equal to <code>77</code> and <code>tomorrow</code> should be equal to <code>80</code>.
testString: assert(today === 77 && tomorrow === 80);
@@ -74,15 +74,6 @@ const tomorrow = HIGH_TEMPERATURES.tomorrow;
</div>
### After Test
<div id='js-teardown'>
```js
const removeJSComments = str => str.replace(/\/\*[\s\S]*?\*\/|\/\/.*$/gm, '');
```
</div>
</section>
## Solution

View File

@@ -43,7 +43,7 @@ tests:
- text: <code>half(stats)</code> should be <code>28.015</code>
testString: assert(half(stats) === 28.015);
- text: Destructuring should be used.
testString: assert(code.replace(/\s/g, '').match(/half=\({\w+,\w+}\)/));
testString: assert(__helpers.removeWhiteSpace(code).match(/half=\({\w+,\w+}\)/));
- text: Destructured parameter should be used.
testString: assert(!code.match(/stats\.max|stats\.min/));

View File

@@ -37,7 +37,7 @@ tests:
- text: <code>Array.slice()</code> should not be used.
testString: getUserInput => assert(!getUserInput('index').match(/slice/g));
- text: Destructuring on <code>list</code> should be used.
testString: assert(code.replace(/\s/g, '').match(/\[(([_$a-z]\w*)?,){1,}\.\.\.arr\]=list/i));
testString: assert(__helpers.removeWhiteSpace(code).match(/\[(([_$a-z]\w*)?,){1,}\.\.\.arr\]=list/i));
```

View File

@@ -40,7 +40,7 @@ tests:
- text: The result of <code>sum()</code> should be 0
testString: assert(sum() === 0);
- text: The <code>sum</code> function should use the <code>...</code> rest parameter on the <code>args</code> parameter.
testString: assert(code.replace(/\s/g,'').match(/sum=\(\.\.\.args\)=>/));
testString: assert(__helpers.removeWhiteSpace(code).match(/sum=\(\.\.\.args\)=>/));
```

View File

@@ -42,7 +42,7 @@ Refactor the function <code>setGear</code> inside the object <code>bicycle</code
```yml
tests:
- text: Traditional function expression should not be used.
testString: getUserInput => assert(!removeJSComments(code).match(/function/));
testString: getUserInput => assert(!__helpers.removeJSComments(code).match(/function/));
- text: <code>setGear</code> should be a declarative function.
testString: assert(typeof bicycle.setGear === 'function' && code.match(/setGear\s*\(.+\)\s*\{/));
- text: <code>bicycle.setGear(48)</code> should change the <code>gear</code> value to 48.
@@ -72,15 +72,6 @@ console.log(bicycle.gear);
</div>
### After Test
<div id='js-teardown'>
```js
const removeJSComments = str => str.replace(/\/\*[\s\S]*?\*\/|\/\/.*$/gm, '');
```
</div>
</section>
## Solution