Add tests for AbstractTemplateParser and DirectiveParser

This commit is contained in:
Kim Biesbjerg 2016-12-08 13:53:13 +01:00
parent 2c3b5e580d
commit 23d2a5eb9d
5 changed files with 156 additions and 4 deletions

View File

@ -15,7 +15,8 @@
"build": "npm run clean && tsc",
"watch": "npm run clean && tsc --watch",
"clean": "rm -rf ./dist",
"lint": "tslint --force './src/**/*.ts'"
"lint": "tslint --force './src/**/*.ts'",
"test": "mocha -r ts-node/register tests/**/*.spec.ts"
},
"repository": {
"type": "git",
@ -41,9 +42,14 @@
},
"config": {},
"devDependencies": {
"@types/chai": "^3.4.34",
"@types/cheerio": "^0.17.31",
"@types/glob": "^5.0.30",
"@types/lodash": "^4.14.41",
"@types/mocha": "^2.2.33",
"chai": "^3.5.0",
"mocha": "^3.2.0",
"ts-node": "^1.7.0",
"tslint": "^4.0.2",
"tslint-eslint-rules": "^3.1.0",
"typescript": "^2.0.10"

View File

@ -12,9 +12,9 @@ export abstract class AbstractTemplateParser {
* Extracts inline template from components
*/
protected _extractInlineTemplate(contents: string): string {
const match = new RegExp('template\\s?:\\s?(("|\'|`)(.|[\\r\\n])+?[^\\\\]\\2)').exec(contents);
const match = new RegExp('template\\s?:\\s?("|\'|`)((.|[\\r\\n])+?[^\\\\])\\1').exec(contents);
if (match !== null) {
return match[1];
return match[2];
}
return '';

View File

@ -18,7 +18,8 @@ export class DirectiveParser extends AbstractTemplateParser implements ParserInt
template = this._normalizeTemplateAttributes(template);
$(template)
.find('[translate]')
.find('[translate],[ng2-translate]')
.addBack()
.each((i: number, element: CheerioElement) => {
const $element = $(element);
const attr = $element.attr('translate');

View File

@ -0,0 +1,62 @@
import { expect } from 'chai';
import { AbstractTemplateParser } from '../src/parsers/abstract-template.parser';
class TestTemplateParser extends AbstractTemplateParser {
public isAngularComponent(filePath: string): boolean {
return this._isAngularComponent(filePath);
}
public normalizeTemplateAttributes(template: string): string {
return this._normalizeTemplateAttributes(template);
}
public extractInlineTemplate(contents: string): string {
return this._extractInlineTemplate(contents);
}
}
describe('AbstractTemplateParser', () => {
let parser: TestTemplateParser;
beforeEach(() => {
parser = new TestTemplateParser();
});
it('should recognize js extension as angular component', () => {
const result = parser.isAngularComponent('test.js');
expect(result).to.equal(true);
});
it('should recognize ts extension as angular component', () => {
const result = parser.isAngularComponent('test.ts');
expect(result).to.equal(true);
});
it('should not recognize html extension as angular component', () => {
const result = parser.isAngularComponent('test.html');
expect(result).to.equal(false);
});
it('should extract inline template', () => {
const contents = `
@Component({
selector: 'test',
template: '<p translate>Hello World</p>'
})
export class TestComponent { }
`;
const template = parser.extractInlineTemplate(contents);
expect(template).to.equal('<p translate>Hello World</p>');
});
it('should normalize bound attributes', () => {
const contents = `<p [translate]="'KEY'">Hello World</p>`;
const template = parser.normalizeTemplateAttributes(contents);
expect(template).to.equal('<p translate="KEY">Hello World</p>');
});
});

View File

@ -0,0 +1,83 @@
import { expect } from 'chai';
import { DirectiveParser } from '../src/parsers/directive.parser';
describe('DirectiveParser', () => {
const templateFilename: string = 'test.template.html';
const componentFilename: string = 'test.component.ts';
let parser: DirectiveParser;
beforeEach(() => {
parser = new DirectiveParser();
});
it('should extract contents when no translate attribute value is provided', () => {
const contents = '<div translate>Hello World</div>';
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['Hello World']);
});
it('should extract translate attribute if provided', () => {
const contents = '<div translate="KEY">Hello World<div>';
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['KEY']);
});
it('should extract bound translate attribute as key if provided', () => {
const contents = '<div [translate]="\'KEY\'">Hello World<div>';
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['KEY']);
});
it('should extract direct text nodes when no translate attribute value is provided', () => {
const contents = `
<div translate>
<span>&#10003;</span>
Hello <strong>World</strong>
Hi <em>there</em>
</div>
`;
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['Hello', 'Hi']);
});
it('should extract direct text nodes of tags with a translate attribute', () => {
const contents = `
<div translate>
<span>&#10003;</span>
Hello World
<div translate>Hi there</div>
</div>
`;
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['Hello World', 'Hi there']);
});
it('should extract translate attribute if provided or direct text nodes if not', () => {
const contents = `
<div translate="KEY">
<span>&#10003;</span>
Hello World
<p translate>Hi there</p>
<p [translate]="'OTHER_KEY'">Lorem Ipsum</p>
</div>
`;
const messages = parser.process(templateFilename, contents);
expect(messages).to.deep.equal(['KEY', 'Hi there', 'OTHER_KEY']);
});
it('should extract and parse inline template', () => {
const contents = `
@Component({
selector: 'test',
template: '<p translate>Hello World</p>'
})
export class TestComponent { }
`;
const messages = parser.process(componentFilename, contents);
expect(messages).to.deep.equal(['Hello World']);
});
});