gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

test: add tests for translated challenge parser

Browse Source
This commit is contained in:
Oliver Eyton-Williams 2020-02-24 15:03:21 +01:00 committed by Mrugesh Mohapatra
parent f9ffcf0c61
commit fa931134a4
16 changed files with 1195 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
curriculum/__fixtures__/challenge-html-comments.english.md Normal file
View File

@ -0,0 +1,63 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
---
## Description
<section id='description'>
```js
// change code below this line
```
</section>
## Instructions
<section id='instructions'>
To pass the test on this challenge, change your <code>h1</code> element's text to say "Hello World".
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: Your <code>h1</code> element should have the text "Hello World".
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<h1>Hello</h1>
<!-- Add your code below this line -->
<!-- Add your code above this line -->
<style>
/* change code below this line */
/* change code above this line */
</style>
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

58
curriculum/__fixtures__/challenge-js-comments.english.md Normal file
View File

@ -0,0 +1,58 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
---
## Description
<section id='description'>
```js
// change code below this line
```
</section>
## Instructions
<section id='instructions'>
To pass the test on this challenge, change your <code>h1</code> element's text to say "Hello World".
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: Your <code>h1</code> element should have the text "Hello World".
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='js-seed'>
```js
/* Add your code below this line */
// Add your code above this line */
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

58
curriculum/__fixtures__/challenge-jsx-comments.english.md Normal file
View File

@ -0,0 +1,58 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
---
## Description
<section id='description'>
```js
// change code below this line
```
</section>
## Instructions
<section id='instructions'>
To pass the test on this challenge, change your <code>h1</code> element's text to say "Hello World".
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: Your <code>h1</code> element should have the text "Hello World".
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='jsx-seed'>
```jsx
{ /* Add your code below this line */ }
{ /* Add your code above this line */ }
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

25
curriculum/__fixtures__/challenge-stripped.chinese.md Normal file
View File

@ -0,0 +1,25 @@
---
localeTitle: 向HTML Elements说你好
forumTopicId: 18276
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
```
</section>

54
curriculum/__fixtures__/challenge.chinese.md Normal file
View File

@ -0,0 +1,54 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: ''
forumTopicId: 18276
localeTitle: 向HTML Elements说你好
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
testString: 'assert.isTrue((/hello(\s)+world/gi).test($("h1").text()), "Your <code>h1</code> element should have the text "Hello World".");'
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<h1>Hello</h1>
```
</div>
</section>
## Solution
<section id='solution'>
```js
// solution required
```
</section>

62
curriculum/__fixtures__/challenge.english.md Normal file
View File

@ -0,0 +1,62 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 12345
---
## Description
<section id='description'>
Welcome to freeCodeCamp's HTML coding challenges. These will walk you through web development step-by-step.
First, you'll start by building a simple web page using HTML. You can edit code in your code editor, which is embedded into this web page.
Do you see the code in your code editor that says <code>&#60;h1&#62;Hello&#60;/h1&#62;</code>? That's an HTML element.
Most HTML elements have an opening tag and a closing tag.
Opening tags look like this:
<code>&#60;h1&#62;</code>
Closing tags look like this:
<code>&#60;/h1&#62;</code>
The only difference between opening and closing tags is the forward slash after the opening bracket of a closing tag.
Each challenge has tests you can run at any time by clicking the "Run tests" button. When you pass all tests, you'll be prompted to submit your solution and go to the next coding challenge.
</section>
## Instructions
<section id='instructions'>
To pass the test on this challenge, change your <code>h1</code> element's text to say "Hello World".
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: Your <code>h1</code> element should have the text "Hello World".
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<h1>Hello</h1>
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

60
curriculum/__fixtures__/combined-html-comments.md Normal file
View File

@ -0,0 +1,60 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
localeTitle: 向HTML Elements说你好
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<h1>Hello</h1>
<!-- (Chinese) Add your code below this line (Chinese) -->
<!-- (Chinese) Add your code above this line (Chinese) -->
<style>
/* (Chinese) change code below this line (Chinese) */
/* (Chinese) change code above this line (Chinese) */
</style>
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

55
curriculum/__fixtures__/combined-js-comments.md Normal file
View File

@ -0,0 +1,55 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
localeTitle: 向HTML Elements说你好
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='js-seed'>
```js
/* (Chinese) Add your code below this line (Chinese) */
// Add your code above this line */
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

55
curriculum/__fixtures__/combined-jsx-comments.md Normal file
View File

@ -0,0 +1,55 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
localeTitle: 向HTML Elements说你好
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='jsx-seed'>
```jsx
{ /* (Chinese) Add your code below this line (Chinese) */ }
{ /* (Chinese) Add your code above this line (Chinese) */ }
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

54
curriculum/__fixtures__/combined.md Normal file
View File

@ -0,0 +1,54 @@
---
id: bd7123c8c441eddfaeb5bdef
title: Say Hello to HTML Elements
challengeType: 0
videoUrl: 'https://scrimba.com/p/pVMPUv/cE8Gpt2'
forumTopicId: 18276
localeTitle: 向HTML Elements说你好
---
## Description
<section id="description">
欢迎来到freeCodeCamp的HTML编码挑战。这些将逐步引导您完成Web开发。首先，您将首先使用HTML构建一个简单的网页。您可以在<code>code editor</code>编辑<code>code</code> ，该<code>code editor</code>嵌入到此网页中。您是否在代码编辑器中看到<code>&lt;h1&gt;Hello&lt;/h1&gt;</code> ？这是一个HTML <code>element</code> 。大多数HTML元素都有一个<code>opening tag</code>和一个<code>closing tag</code> 。打开标记如下所示： <code>&lt;h1&gt;</code>结束标记如下所示： <code>&lt;/h1&gt;</code>开始标记和结束标记之间的唯一区别是结束标记的左括号后面的正斜杠。每个挑战都有可以随时单击“运行测试”按钮运行的测试。当您通过所有测试时，系统会提示您提交解决方案并转到下一个编码挑战。
</section>
## Instructions
<section id="instructions">
要通过此挑战的测试，请将<code>h1</code>元素的文本更改为“Hello World”。
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: 你的<code>h1</code>元素应该有“Hello World”文本。
testString: assert.isTrue((/hello(\s)+world/gi).test($('h1').text()));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<h1>Hello</h1>
```
</div>
</section>
## Solution
<section id='solution'>
```html
<h1>Hello World</h1>
```
</section>

80
curriculum/getChallenges.acceptance.test.js Normal file
View File

@ -0,0 +1,80 @@
/* global expect */
const path = require('path');
const { parseMarkdown } = require('../tools/challenge-md-parser');
const { parseTranslation } = require('./getChallenges');
/* eslint-disable max-len */
const {
SIMPLE_TRANSLATION
} = require('../tools/challenge-md-parser/translation-parser/__mocks__/mock-comments');
/* eslint-enable max-len */
describe('translation parser', () => {
it('should combine to the correct object', () => {
return Promise.all([
parseMarkdown(path.resolve(__dirname, '__fixtures__/combined.md')),
parseTranslation(
path.resolve(__dirname, '__fixtures__/challenge.english.md'),
path.resolve(__dirname, '__fixtures__/challenge.chinese.md'),
SIMPLE_TRANSLATION
)
]).then(xs => expect(xs[1]).toEqual(xs[0]));
});
it('should translate known comments in html', () => {
return Promise.all([
parseMarkdown(
path.resolve(__dirname, '__fixtures__/combined-html-comments.md')
),
parseTranslation(
path.resolve(
__dirname,
'__fixtures__/challenge-html-comments.english.md'
),
path.resolve(__dirname, '__fixtures__/challenge.chinese.md'),
SIMPLE_TRANSLATION
)
]).then(xs => expect(xs[1]).toEqual(xs[0]));
});
it('should translate known comments in jsx', () => {
return Promise.all([
parseMarkdown(
path.resolve(__dirname, '__fixtures__/combined-jsx-comments.md')
),
parseTranslation(
path.resolve(
__dirname,
'__fixtures__/challenge-jsx-comments.english.md'
),
path.resolve(__dirname, '__fixtures__/challenge.chinese.md'),
SIMPLE_TRANSLATION
)
]).then(xs => expect(xs[1]).toEqual(xs[0]));
});
it('should translate known comments in js', () => {
return Promise.all([
parseMarkdown(
path.resolve(__dirname, '__fixtures__/combined-js-comments.md')
),
parseTranslation(
path.resolve(
__dirname,
'__fixtures__/challenge-js-comments.english.md'
),
path.resolve(__dirname, '__fixtures__/challenge.chinese.md'),
SIMPLE_TRANSLATION
)
]).then(xs => expect(xs[1]).toEqual(xs[0]));
});
it('should handle a stripped down challenge', () => {
return Promise.all([
parseMarkdown(path.resolve(__dirname, '__fixtures__/combined.md')),
parseTranslation(
path.resolve(__dirname, '__fixtures__/challenge.english.md'),
path.resolve(__dirname, '__fixtures__/challenge-stripped.chinese.md'),
SIMPLE_TRANSLATION
)
]).then(xs => expect(xs[1]).toEqual(xs[0]));
});
});

68
curriculum/getChallenges.test.js Normal file
View File

@ -0,0 +1,68 @@
/* global expect */
const {
createChallenge,
getChallengeLang,
getEnglishPath,
isEnglishChallenge
} = require('./getChallenges');
/* eslint-disable max-len */
const INVALID_PATH = 'not/challenge/path';
const ENGLISH_PATH =
'curriculum/challenges/english/01-responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility.english.md';
const CHINESE_PATH =
'curriculum/challenges/chinese/01-responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility.chinese.md';
const NOT_LANGUAGE_PATH =
'curriculum/challenges/chinese/01-responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility.notlang.md';
const MISSING_LANGUAGE_PATH =
'curriculum/challenges/chinese/01-responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-english.md';
/* eslint-enable max-len */
describe('create non-English challenge', () => {
describe('createChallenge', () => {
it('throws if the filename includes an invalid language', async () => {
await expect(createChallenge(NOT_LANGUAGE_PATH)).rejects.toThrow(
'notlang is not a accepted language'
);
});
it('throws an error if the filename is missing a language', async () => {
await expect(createChallenge(MISSING_LANGUAGE_PATH)).rejects.toThrow(
`Missing language extension for
${MISSING_LANGUAGE_PATH}`
);
});
});
describe('getEnglishPath', () => {
it('returns the full path of the English version of the challenge', () => {
expect(getEnglishPath(CHINESE_PATH)).toBe(ENGLISH_PATH);
});
it('throws an error if the path has the wrong directory structure', () => {
expect(() => getEnglishPath(INVALID_PATH)).toThrow();
});
it('throws an error if the filename includes an invalid language', () => {
expect(() => getEnglishPath(NOT_LANGUAGE_PATH)).toThrow();
});
it('throws an error if the filename is missing a language', () => {
expect(() => getEnglishPath(MISSING_LANGUAGE_PATH)).toThrow();
});
});
describe('getChallengeLang', () => {
it("returns 'english' if the challenge is English", () => {
expect(getChallengeLang(ENGLISH_PATH)).toBe('english');
});
it("returns 'chinese' if the challenge is Chinese", () => {
expect(getChallengeLang(CHINESE_PATH)).toBe('chinese');
});
});
describe('isEnglishChallenge', () => {
it('returns true if the challenge is English', () => {
expect(isEnglishChallenge(ENGLISH_PATH)).toBe(true);
});
it('returns false if the challenge is not English', () => {
expect(isEnglishChallenge(CHINESE_PATH)).toBe(false);
});
});
});

1
package.json
View File

@ -59,6 +59,7 @@
"test": "npm-run-all -p test:*",
"test:client": "cd ./client && npm test && cd ../",
"test:curriculum": "cd ./curriculum && npm test && cd ../",
"test:curriculum-js": "jest --rootDir ./curriculum",
"test:server": "cd ./api-server && npm test && cd ../",
"test:tools": "jest ./tools",
"test:utils": "jest --rootDir ./utils"

149
tools/challenge-md-parser/translation-parser/__fixtures__/challenge-objects.js Normal file
View File

@ -0,0 +1,149 @@
const ENGLISH_CHALLENGE = {
id: 'id',
title: 'Title',
challengeType: 0,
videoUrl: 'https://scrimba.com/',
forumTopicId: 12345,
tests: [
{
text: 'Test text',
testString: 'assertions'
},
{
text: 'Test text2',
testString: 'assertions2'
}
],
solutions: ['solution html string'],
description: 'description html string',
instructions: 'instructions html string',
files: [
{
key: 'indexhtml',
ext: 'html',
name: 'index',
contents: 'seed html string',
head: 'head string',
tail: 'tail string'
}
]
};
const ENGLISH_CHALLENGE_TWO_SOLUTIONS = {
id: 'id',
title: 'Title',
challengeType: 0,
videoUrl: 'https://scrimba.com/',
forumTopicId: 12345,
tests: [
{
text: 'Test text',
testString: 'assertions'
},
{
text: 'Test text2',
testString: 'assertions2'
}
],
solutions: ['solution html string', 'second solution html string'],
description: 'description html string',
instructions: 'instructions html string',
files: [
{
key: 'indexhtml',
ext: 'html',
name: 'index',
contents: 'seed html string',
head: '',
tail: ''
}
]
};
const ENGLISH_CHALLENGE_NO_FILES = {
id: 'id',
title: 'Title',
challengeType: 0,
videoUrl: 'https://scrimba.com/',
forumTopicId: 12345,
tests: [
{
text: 'Test text',
testString: 'assertions'
},
{
text: 'Test text2',
testString: 'assertions2'
}
],
solutions: ['solution html string'],
description: 'description html string',
instructions: 'instructions html string',
files: []
};
const TRANSLATED_CHALLENGE = {
id: 'id',
title: 'Title',
challengeType: 0,
videoUrl: 'https://scrimba.com/',
forumTopicId: 9876,
localeTitle: 'Translated title',
tests: [
{
text: 'Translated test text',
testString: 'Translated assertions, should be ignored'
},
{
text: 'Translated test text2',
testString: 'Translated assertions, should be ignored2'
}
],
solutions: ['Translated solution html string, should be ignored'],
description: 'Translated description html string',
instructions: 'Translated instructions html string',
files: [
{
key: 'indexhtml',
ext: 'html',
name: 'index',
contents: 'Translated seed html string, should be ignored',
head: 'Translated head string, should be ignored',
tail: 'Translated tail string, should be ignored'
}
]
};
const WRONG_NUM_TESTS_CHALLENGE = {
id: 'id',
title: 'Title',
challengeType: 0,
videoUrl: 'https://scrimba.com/',
forumTopicId: 12345,
localeTitle: 'Translated title',
tests: [
{
text: 'Translated test text',
testString: 'Translated assertions, should be ignored'
}
],
solutions: ['Translated solution html string, should be ignored'],
description: 'Translated description html string',
instructions: 'Translated instructions html string',
files: [
{
key: 'indexhtml',
ext: 'html',
name: 'index',
contents: 'Translated seed html string, should be ignored',
head: '',
tail: ''
}
]
};
exports.ENGLISH_CHALLENGE = ENGLISH_CHALLENGE;
exports.ENGLISH_CHALLENGE_TWO_SOLUTIONS = ENGLISH_CHALLENGE_TWO_SOLUTIONS;
exports.ENGLISH_CHALLENGE_NO_FILES = ENGLISH_CHALLENGE_NO_FILES;
exports.TRANSLATED_CHALLENGE = TRANSLATED_CHALLENGE;
exports.WRONG_NUM_TESTS_CHALLENGE = WRONG_NUM_TESTS_CHALLENGE;

16
tools/challenge-md-parser/translation-parser/__mocks__/mock-comments.js Normal file
View File

@ -0,0 +1,16 @@
const SIMPLE_TRANSLATION = {
'Add your code below this line': {
chinese: '(Chinese) Add your code below this line (Chinese)'
},
'Add your code above this line': {
chinese: '(Chinese) Add your code above this line (Chinese)'
},
'change code below this line': {
chinese: '(Chinese) change code below this line (Chinese)'
},
'change code above this line': {
chinese: '(Chinese) change code above this line (Chinese)'
}
};
exports.SIMPLE_TRANSLATION = SIMPLE_TRANSLATION;

337
tools/challenge-md-parser/translation-parser/translation-parser.test.js Normal file
View File

@ -0,0 +1,337 @@
/* global expect jest */
const {
mergeChallenges,
translateComments,
translateCommentsInChallenge
} = require('./translation-parser');
const {
ENGLISH_CHALLENGE,
ENGLISH_CHALLENGE_NO_FILES,
ENGLISH_CHALLENGE_TWO_SOLUTIONS,
TRANSLATED_CHALLENGE,
WRONG_NUM_TESTS_CHALLENGE
} = require('./__fixtures__/challenge-objects');
const { SIMPLE_TRANSLATION } = require('./__mocks__/mock-comments');
const COMBINED_CHALLENGE = mergeChallenges(
ENGLISH_CHALLENGE,
TRANSLATED_CHALLENGE
);
const COMBINED_CHALLENGE_TWO_SOLUTIONS = mergeChallenges(
ENGLISH_CHALLENGE_TWO_SOLUTIONS,
TRANSLATED_CHALLENGE
);
let logSpy;
describe('translation parser', () => {
beforeEach(() => {
logSpy = jest.spyOn(console, 'warn').mockImplementation();
});
afterEach(() => {
logSpy.mockRestore();
});
describe('mergeChallenges', () => {
it('takes the description from the second challenge', () => {
expect(COMBINED_CHALLENGE.description).toBe(
TRANSLATED_CHALLENGE.description
);
});
it('takes the head and tail from the first challenge', () => {
expect(COMBINED_CHALLENGE.files[0].head).toBe(
ENGLISH_CHALLENGE.files[0].head
);
expect(COMBINED_CHALLENGE.files[0].tail).toBe(
ENGLISH_CHALLENGE.files[0].tail
);
});
it('takes the instructions from the second challenge', () => {
expect(COMBINED_CHALLENGE.instructions).toBe(
TRANSLATED_CHALLENGE.instructions
);
});
it('takes the seed from the first challenge', () => {
expect(COMBINED_CHALLENGE.files[0].contents).toBe(
ENGLISH_CHALLENGE.files[0].contents
);
});
it('takes the solution from the first challenge', () => {
expect(COMBINED_CHALLENGE.solutions[0]).toBe(
ENGLISH_CHALLENGE.solutions[0]
);
});
it('takes multiple solutions', () => {
expect(COMBINED_CHALLENGE_TWO_SOLUTIONS.solutions).toEqual(
ENGLISH_CHALLENGE_TWO_SOLUTIONS.solutions
);
});
it('takes the testStrings from the first challenge', () => {
const actualStrings = COMBINED_CHALLENGE.tests.map(
({ testString }) => testString
);
const expectedStrings = ENGLISH_CHALLENGE.tests.map(
({ testString }) => testString
);
for (let i = 0; i < actualStrings.length; i++) {
expect(actualStrings[i]).toBe(expectedStrings[i]);
}
});
it('takes the test text from the second challenge', () => {
const actualStrings = COMBINED_CHALLENGE.tests.map(({ text }) => text);
const expectedStrings = TRANSLATED_CHALLENGE.tests.map(
({ text }) => text
);
for (let i = 0; i < actualStrings.length; i++) {
expect(actualStrings[i]).toBe(expectedStrings[i]);
}
});
it('takes the localTitle from the second challenge', () => {
expect(COMBINED_CHALLENGE.localeTitle).toBe(
TRANSLATED_CHALLENGE.localeTitle
);
});
it('throws an error if the numbers of tests do not match', () => {
expect(() =>
mergeChallenges(ENGLISH_CHALLENGE, WRONG_NUM_TESTS_CHALLENGE)
).toThrow();
});
it('takes the forum id from the second challenge', () => {
expect(COMBINED_CHALLENGE.forumTopicId).toBe(
TRANSLATED_CHALLENGE.forumTopicId
);
});
});
describe('translateCommentsInChallenge', () => {
it('returns a clone of the challenge if there are no comments', () => {
expect(
translateCommentsInChallenge(
ENGLISH_CHALLENGE_NO_FILES,
'chinese',
SIMPLE_TRANSLATION
)
).toEqual(ENGLISH_CHALLENGE_NO_FILES);
});
});
describe('translateComments', () => {
it('replaces single line English comments with their translations', () => {
const seed = `// Add your code below this line
Add your code above this line `;
const transSeed = `// (Chinese) Add your code below this line (Chinese)
Add your code above this line `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
});
it('replaces inline English comments with their translations', () => {
const seed = `inline comment // Add your code below this line
Add your code above this line `;
const transSeed = `inline comment // (Chinese) Add your code below this line (Chinese)
Add your code above this line `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
});
// If a comment follows '"` it could be inside a string, so we should
// not try and translate it - erring on the side of caution.
it('should ignore comments if they follow an open quote', () => {
const seed = `var str = '// Add your code below this line'
var str2 = '// Add your code above this line`;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
seed
);
});
it('replaces multiple English comments with their translations', () => {
const seed = `inline comment // Add your code below this line
// Add your code below this line `;
const transSeed = `inline comment // (Chinese) Add your code below this line (Chinese)
// (Chinese) Add your code below this line (Chinese) `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
});
it('replaces multiline English comments with their translations', () => {
const seed = `multiline comment /* Add your code below this line */
/* Add your code above this line */ change code below this line `;
const transSeed = `multiline comment /* (Chinese) Add your code below this line (Chinese) */
/* (Chinese) Add your code above this line (Chinese) */ change code below this line `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
});
it('replaces repeated multiline comments with their translations', () => {
const seed = `multiline comment /* Add your code below this line */
/* Add your code below this line */ change code below this line `;
const transSeed = `multiline comment /* (Chinese) Add your code below this line (Chinese) */
/* (Chinese) Add your code below this line (Chinese) */ change code below this line `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
});
it('only replaces text inside comments, not between them', () => {
const seed = `multiline comment /* Add your code below this line */
/* Add your code above this line */ Add your code below this line /* */ `;
const transSeed = `multiline comment /* (Chinese) Add your code below this line (Chinese) */
/* (Chinese) Add your code above this line (Chinese) */ Add your code below this line /* */ `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
transSeed
);
const seedTwo = `multiline /* */ Add your code below this line /* */ `;
expect(
translateComments(seedTwo, 'chinese', SIMPLE_TRANSLATION, 'js')
).toBe(seedTwo);
});
it('replaces English html comments with their translations', () => {
const seed = `<div> <!-- Add your code below this line -->
<!-- Add your code above this line --> <span>change code below this line</span> `;
const transSeed = `<div> <!-- (Chinese) Add your code below this line (Chinese) -->
<!-- (Chinese) Add your code above this line (Chinese) --> <span>change code below this line</span> `;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(transSeed);
});
it('replaces css comments with their translations', () => {
const seed = `<style>
/* Add your code below this line */
</style>`;
const transSeed = `<style>
/* (Chinese) Add your code below this line (Chinese) */
</style>`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(transSeed);
});
it('replaces multiple css comments with their translations', () => {
const seed = `<style>
/* Add your code below this line */
/* Add your code below this line */
</style>`;
const transSeed = `<style>
/* (Chinese) Add your code below this line (Chinese) */
/* (Chinese) Add your code below this line (Chinese) */
</style>`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(transSeed);
});
it('ignores css comments outside style tags', () => {
const seed = `/* Add your code below this line */`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(seed);
});
it('ignores css comments between style tags', () => {
const seed = `<style>
</style>
/* Add your code below this line */
<style>
</style>`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(seed);
});
it('only replaces inside English html comments', () => {
const seed = `<div> <!-- --> Add your code below this line <!-- -->`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(seed);
});
it('replaces English JSX comments with their translations', () => {
const seed = `{ /* Add your code below this line */ }
{ /* Add your code above this line */ } <span>change code below this line</span> `;
const transSeed = `{ /* (Chinese) Add your code below this line (Chinese) */ }
{ /* (Chinese) Add your code above this line (Chinese) */ } <span>change code below this line</span> `;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'jsx')
).toBe(transSeed);
});
it('ignores html comments inside JavaScript', () => {
const seed = `<div> <!-- Add your code below this line
Add your code above this line --> <span>change code below this line</span> `;
expect(translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'js')).toBe(
seed
);
});
it('ignores html comments inside jsx', () => {
const seed = `<div> <!-- Add your code below this line
Add your code above this line --> <span>change code below this line</span> `;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'jsx')
).toBe(seed);
});
it('only replaces exact matches (js)', () => {
const seedMulti = `/* Add your code below this line
Add your code above this line */ <span>change code below this line</span> `;
const seedInline = `// Add your code below this line, please`;
expect(
translateComments(seedMulti, 'chinese', SIMPLE_TRANSLATION, 'js')
).toBe(seedMulti);
expect(
translateComments(seedInline, 'chinese', SIMPLE_TRANSLATION, 'js')
).toBe(seedInline);
});
it('only replaces exact matches (jsx)', () => {
const seedMulti = `{ /* Add your code below this line
Add your code above this line */ } <span>change code below this line</span> `;
expect(
translateComments(seedMulti, 'chinese', SIMPLE_TRANSLATION, 'jsx')
).toBe(seedMulti);
});
it('only replaces exact matches (html)', () => {
const seed = `<div> <!-- Add your code below this line
Add your code above this line --> <span>change code below this line</span> `;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'html')
).toBe(seed);
});
it('only translates jsx comments once', () => {
const seed = `{ /* Add your code below this line */ }`;
const transSeed = `{ /* (Chinese) Add your code below this line (Chinese) */ }`;
expect(
translateComments(seed, 'chinese', SIMPLE_TRANSLATION, 'jsx')
).toBe(transSeed);
});
it('warns if the comment is not in the dictionary', () => {
const seedJSX = `{ /* this is not a comment */ }`;
const seedInline = `// this is not a comment `;
const seedMulti = `/* this is not a comment */`;
const seedCSS = `<style>
/* this is not a comment */
</style>`;
const seedHTML = `<div> <!-- this is not a comment --> `;
translateComments(seedJSX, 'chinese', SIMPLE_TRANSLATION, 'jsx');
expect(logSpy).toBeCalledTimes(1);
translateComments(seedInline, 'chinese', SIMPLE_TRANSLATION, 'js');
expect(logSpy).toBeCalledTimes(2);
translateComments(seedMulti, 'chinese', SIMPLE_TRANSLATION, 'js');
expect(logSpy).toBeCalledTimes(3);
translateComments(seedCSS, 'chinese', SIMPLE_TRANSLATION, 'html');
expect(logSpy).toBeCalledTimes(4);
translateComments(seedHTML, 'chinese', SIMPLE_TRANSLATION, 'html');
expect(logSpy).toBeCalledTimes(5);
logSpy.mockRestore();
});
});
});