feat(Compiler): case sensitive html parser
This commit is contained in:
Tobias Bosch
committed by
Victor Berchet
Victor Berchet
parent
e274ff8a69
commit
86aeb8be0a
@ -380,7 +380,7 @@ export function main() {
|
||||
run(rootComp, [dir], 1)
|
||||
.then((data) => {
|
||||
expect(data[0][2])
|
||||
.toEqual(['someEmptyVar', '$implicit', 'someVar', 'someValue']);
|
||||
.toEqual(['someVar', 'someValue', 'someEmptyVar', '$implicit']);
|
||||
async.done();
|
||||
});
|
||||
}));
|
||||
|
||||
523
modules/angular2/test/compiler/html_lexer_spec.ts
Normal file
523
modules/angular2/test/compiler/html_lexer_spec.ts
Normal file
@ -0,0 +1,523 @@
|
||||
import {ddescribe, describe, it, iit, xit, expect, beforeEach, afterEach} from '../../test_lib';
|
||||
import {BaseException} from '../../src/facade/exceptions';
|
||||
|
||||
import {tokenizeHtml, HtmlToken, HtmlTokenType} from '../../src/compiler/html_lexer';
|
||||
import {ParseSourceSpan, ParseLocation} from '../../src/compiler/parse_util';
|
||||
|
||||
export function main() {
|
||||
describe('HtmlLexer', () => {
|
||||
describe('line/column numbers', () => {
|
||||
it('should work without newlines', () => {
|
||||
expect(tokenizeAndHumanizeLineColumn('<t>a</t>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '0:0'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '0:2'],
|
||||
[HtmlTokenType.TEXT, '0:3'],
|
||||
[HtmlTokenType.TAG_CLOSE, '0:4'],
|
||||
[HtmlTokenType.EOF, '0:8']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should work with one newline', () => {
|
||||
expect(tokenizeAndHumanizeLineColumn('<t>\na</t>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '0:0'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '0:2'],
|
||||
[HtmlTokenType.TEXT, '0:3'],
|
||||
[HtmlTokenType.TAG_CLOSE, '1:1'],
|
||||
[HtmlTokenType.EOF, '1:5']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should work with multiple newlines', () => {
|
||||
expect(tokenizeAndHumanizeLineColumn('<t\n>\na</t>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '0:0'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '1:0'],
|
||||
[HtmlTokenType.TEXT, '1:1'],
|
||||
[HtmlTokenType.TAG_CLOSE, '2:1'],
|
||||
[HtmlTokenType.EOF, '2:5']
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('comments', () => {
|
||||
it('should parse comments', () => {
|
||||
expect(tokenizeAndHumanizeParts('<!--test-->'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.COMMENT_START],
|
||||
[HtmlTokenType.RAW_TEXT, 'test'],
|
||||
[HtmlTokenType.COMMENT_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {expect(tokenizeAndHumanizeSourceSpans('<!--test-->'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.COMMENT_START, '<!--'],
|
||||
[HtmlTokenType.RAW_TEXT, 'test'],
|
||||
[HtmlTokenType.COMMENT_END, '-->'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
])});
|
||||
|
||||
it('should report <!- without -', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<!-a'))
|
||||
.toEqual([[HtmlTokenType.COMMENT_START, 'Unexpected character "a"', '0:3']]);
|
||||
});
|
||||
|
||||
it('should report missing end comment', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<!--'))
|
||||
.toEqual([[HtmlTokenType.RAW_TEXT, 'Unexpected character "EOF"', '0:4']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('doctype', () => {
|
||||
it('should parse doctypes', () => {
|
||||
expect(tokenizeAndHumanizeParts('<!doctype html>'))
|
||||
.toEqual([[HtmlTokenType.DOC_TYPE, 'doctype html'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('<!doctype html>'))
|
||||
.toEqual([[HtmlTokenType.DOC_TYPE, '<!doctype html>'], [HtmlTokenType.EOF, '']]);
|
||||
});
|
||||
|
||||
it('should report missing end doctype', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<!'))
|
||||
.toEqual([[HtmlTokenType.DOC_TYPE, 'Unexpected character "EOF"', '0:2']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('cdata', () => {
|
||||
it('should parse cdata', () => {
|
||||
expect(tokenizeAndHumanizeParts('<![cdata[test]]>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.CDATA_START],
|
||||
[HtmlTokenType.RAW_TEXT, 'test'],
|
||||
[HtmlTokenType.CDATA_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('<![cdata[test]]>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.CDATA_START, '<![cdata['],
|
||||
[HtmlTokenType.RAW_TEXT, 'test'],
|
||||
[HtmlTokenType.CDATA_END, ']]>'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should report <![ without cdata[', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<![a'))
|
||||
.toEqual([[HtmlTokenType.CDATA_START, 'Unexpected character "a"', '0:3']]);
|
||||
});
|
||||
|
||||
it('should report missing end cdata', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<![cdata['))
|
||||
.toEqual([[HtmlTokenType.RAW_TEXT, 'Unexpected character "EOF"', '0:9']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('open tags', () => {
|
||||
it('should parse open tags without prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('<test>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'test'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse namespace prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('<ns1:test>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, 'ns1', 'test'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse void tags', () => {
|
||||
expect(tokenizeAndHumanizeParts('<test/>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'test'],
|
||||
[HtmlTokenType.TAG_OPEN_END_VOID],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should allow whitespace', () => {
|
||||
expect(tokenizeAndHumanizeParts('< test >'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'test'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('<test>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '<test'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '>'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should report missing name after <', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<'))
|
||||
.toEqual([[HtmlTokenType.TAG_OPEN_START, 'Unexpected character "EOF"', '0:1']]);
|
||||
});
|
||||
|
||||
it('should report missing >', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<name'))
|
||||
.toEqual([[HtmlTokenType.TAG_OPEN_START, 'Unexpected character "EOF"', '0:5']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('attributes', () => {
|
||||
it('should parse attributes without prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t a>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes with prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t ns1:a>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, 'ns1', 'a'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes whose prefix is not valid', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t (ns1:a)>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, '(ns1:a)'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes with single quote value', () => {
|
||||
expect(tokenizeAndHumanizeParts("<t a='b'>"))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'b'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes with double quote value', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t a="b">'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'b'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes with unquoted value', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t a=b>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'b'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should allow whitespace', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t a = b >'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'b'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes with entities in values', () => {
|
||||
expect(tokenizeAndHumanizeParts('<t a="A">'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 't'],
|
||||
[HtmlTokenType.ATTR_NAME, null, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'A'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('<t a=b>'))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '<t'],
|
||||
[HtmlTokenType.ATTR_NAME, 'a'],
|
||||
[HtmlTokenType.ATTR_VALUE, 'b'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '>'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should report missing value after =', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<name a='))
|
||||
.toEqual([[HtmlTokenType.ATTR_VALUE, 'Unexpected character "EOF"', '0:8']]);
|
||||
});
|
||||
|
||||
it('should report missing end quote for \'', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<name a=\''))
|
||||
.toEqual([[HtmlTokenType.ATTR_VALUE, 'Unexpected character "EOF"', '0:9']]);
|
||||
});
|
||||
|
||||
it('should report missing end quote for "', () => {
|
||||
expect(tokenizeAndHumanizeErrors('<name a="'))
|
||||
.toEqual([[HtmlTokenType.ATTR_VALUE, 'Unexpected character "EOF"', '0:9']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('closing tags', () => {
|
||||
it('should parse closing tags without prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('</test>'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, null, 'test'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should parse closing tags with prefix', () => {
|
||||
expect(tokenizeAndHumanizeParts('</ns1:test>'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, 'ns1', 'test'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should allow whitespace', () => {
|
||||
expect(tokenizeAndHumanizeParts('</ test >'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, null, 'test'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('</test>'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, '</test>'], [HtmlTokenType.EOF, '']]);
|
||||
});
|
||||
|
||||
it('should report missing name after </', () => {
|
||||
expect(tokenizeAndHumanizeErrors('</'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, 'Unexpected character "EOF"', '0:2']]);
|
||||
});
|
||||
|
||||
it('should report missing >', () => {
|
||||
expect(tokenizeAndHumanizeErrors('</test'))
|
||||
.toEqual([[HtmlTokenType.TAG_CLOSE, 'Unexpected character "EOF"', '0:6']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('entities', () => {
|
||||
it('should parse named entities', () => {
|
||||
expect(tokenizeAndHumanizeParts('a&b'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'a&b'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should parse hexadecimal entities', () => {
|
||||
expect(tokenizeAndHumanizeParts('A'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'A'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should parse decimal entities', () => {
|
||||
expect(tokenizeAndHumanizeParts('A'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'A'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('a&b'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'a&b'], [HtmlTokenType.EOF, '']]);
|
||||
});
|
||||
|
||||
it('should report unknown named entities >', () => {
|
||||
expect(tokenizeAndHumanizeErrors('&tbo;'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'Unknown entity "tbo"', '0:0']]);
|
||||
expect(tokenizeAndHumanizeErrors('&#asdf;'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'Unknown entity "#asdf"', '0:0']]);
|
||||
expect(tokenizeAndHumanizeErrors('
sdf;'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'Unknown entity "#xasdf"', '0:0']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('regular text', () => {
|
||||
it('should parse text', () => {
|
||||
expect(tokenizeAndHumanizeParts('a'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'a'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should parse entities', () => {
|
||||
expect(tokenizeAndHumanizeParts('a&b'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'a&b'], [HtmlTokenType.EOF]]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans('a'))
|
||||
.toEqual([[HtmlTokenType.TEXT, 'a'], [HtmlTokenType.EOF, '']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('raw text', () => {
|
||||
it('should parse text', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<script>a</script>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'script'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.RAW_TEXT, 'a'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'script'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should not detect entities', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<script>&</script>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'script'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.RAW_TEXT, '&'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'script'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should ignore other opening tags', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<script>a<div></script>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'script'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.RAW_TEXT, 'a<div>'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'script'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should ignore other closing tags', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<script>a</test></script>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'script'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.RAW_TEXT, 'a</test>'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'script'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans(`<script>a</script>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '<script'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '>'],
|
||||
[HtmlTokenType.RAW_TEXT, 'a'],
|
||||
[HtmlTokenType.TAG_CLOSE, '</script>'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('escapable raw text', () => {
|
||||
it('should parse text', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<title>a</title>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'title'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.ESCAPABLE_RAW_TEXT, 'a'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'title'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should detect entities', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<title>&</title>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'title'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.ESCAPABLE_RAW_TEXT, '&'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'title'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should ignore other opening tags', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<title>a<div></title>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'title'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.ESCAPABLE_RAW_TEXT, 'a<div>'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'title'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should ignore other closing tags', () => {
|
||||
expect(tokenizeAndHumanizeParts(`<title>a</test></title>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, null, 'title'],
|
||||
[HtmlTokenType.TAG_OPEN_END],
|
||||
[HtmlTokenType.ESCAPABLE_RAW_TEXT, 'a</test>'],
|
||||
[HtmlTokenType.TAG_CLOSE, null, 'title'],
|
||||
[HtmlTokenType.EOF]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should store the locations', () => {
|
||||
expect(tokenizeAndHumanizeSourceSpans(`<title>a</title>`))
|
||||
.toEqual([
|
||||
[HtmlTokenType.TAG_OPEN_START, '<title'],
|
||||
[HtmlTokenType.TAG_OPEN_END, '>'],
|
||||
[HtmlTokenType.ESCAPABLE_RAW_TEXT, 'a'],
|
||||
[HtmlTokenType.TAG_CLOSE, '</title>'],
|
||||
[HtmlTokenType.EOF, '']
|
||||
]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function tokenizeWithoutErrors(input: string): HtmlToken[] {
|
||||
var tokenizeResult = tokenizeHtml(input, 'someUrl');
|
||||
if (tokenizeResult.errors.length > 0) {
|
||||
var errorString = tokenizeResult.errors.join('\n');
|
||||
throw new BaseException(`Unexpected parse errors:\n${errorString}`);
|
||||
}
|
||||
return tokenizeResult.tokens;
|
||||
}
|
||||
|
||||
function tokenizeAndHumanizeParts(input: string): any[] {
|
||||
return tokenizeWithoutErrors(input).map(token => [<any>token.type].concat(token.parts));
|
||||
}
|
||||
|
||||
function tokenizeAndHumanizeSourceSpans(input: string): any[] {
|
||||
return tokenizeWithoutErrors(input).map(token => [<any>token.type, token.sourceSpan.toString()]);
|
||||
}
|
||||
|
||||
function humanizeLineColumn(location: ParseLocation): string {
|
||||
return `${location.line}:${location.col}`;
|
||||
}
|
||||
|
||||
function tokenizeAndHumanizeLineColumn(input: string): any[] {
|
||||
return tokenizeWithoutErrors(input)
|
||||
.map(token => [<any>token.type, humanizeLineColumn(token.sourceSpan.start)]);
|
||||
}
|
||||
|
||||
function tokenizeAndHumanizeErrors(input: string): any[] {
|
||||
return tokenizeHtml(input, 'someUrl')
|
||||
.errors.map(
|
||||
tokenError =>
|
||||
[<any>tokenError.tokenType, tokenError.msg, humanizeLineColumn(tokenError.location)]);
|
||||
}
|
||||
@ -9,7 +9,8 @@ import {
|
||||
afterEach
|
||||
} from 'angular2/testing_internal';
|
||||
|
||||
import {HtmlParser} from 'angular2/src/compiler/html_parser';
|
||||
|
||||
import {HtmlParser, HtmlParseTreeResult} from 'angular2/src/compiler/html_parser';
|
||||
import {
|
||||
HtmlAst,
|
||||
HtmlAstVisitor,
|
||||
@ -20,129 +21,106 @@ import {
|
||||
} from 'angular2/src/compiler/html_ast';
|
||||
|
||||
export function main() {
|
||||
describe('DomParser', () => {
|
||||
describe('HtmlParser', () => {
|
||||
var parser: HtmlParser;
|
||||
beforeEach(() => { parser = new HtmlParser(); });
|
||||
|
||||
describe('parse', () => {
|
||||
// TODO: add more test cases
|
||||
// TODO: separate tests for source spans from tests for tree parsing
|
||||
// TODO: find a better way to assert the tree structure!
|
||||
// -> maybe with arrays and object hashes!!
|
||||
|
||||
describe('parse', () => {
|
||||
describe('text nodes', () => {
|
||||
it('should parse root level text nodes', () => {
|
||||
expect(humanizeDom(parser.parse('a', 'TestComp')))
|
||||
.toEqual([[HtmlTextAst, 'a', 'TestComp > #text(a):nth-child(0)']]);
|
||||
expect(humanizeDom(parser.parse('a', 'TestComp'))).toEqual([[HtmlTextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should parse text nodes inside regular elements', () => {
|
||||
expect(humanizeDom(parser.parse('<div>a</div>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[HtmlTextAst, 'a', 'TestComp > div:nth-child(0) > #text(a):nth-child(0)']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, 'div'], [HtmlTextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should parse text nodes inside template elements', () => {
|
||||
expect(humanizeDom(parser.parse('<template>a</template>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'template', 'TestComp > template:nth-child(0)'],
|
||||
[HtmlTextAst, 'a', 'TestComp > template:nth-child(0) > #text(a):nth-child(0)']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, 'template'], [HtmlTextAst, 'a']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('elements', () => {
|
||||
it('should parse root level elements', () => {
|
||||
expect(humanizeDom(parser.parse('<div></div>', 'TestComp')))
|
||||
.toEqual([[HtmlElementAst, 'div', 'TestComp > div:nth-child(0)']]);
|
||||
.toEqual([[HtmlElementAst, 'div']]);
|
||||
});
|
||||
|
||||
it('should parse elements inside of regular elements', () => {
|
||||
expect(humanizeDom(parser.parse('<div><span></span></div>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[HtmlElementAst, 'span', 'TestComp > div:nth-child(0) > span:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, 'div'], [HtmlElementAst, 'span']]);
|
||||
});
|
||||
|
||||
it('should parse elements inside of template elements', () => {
|
||||
expect(humanizeDom(parser.parse('<template><span></span></template>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'template', 'TestComp > template:nth-child(0)'],
|
||||
[HtmlElementAst, 'span', 'TestComp > template:nth-child(0) > span:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, 'template'], [HtmlElementAst, 'span']]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('attributes', () => {
|
||||
it('should parse attributes on regular elements', () => {
|
||||
expect(humanizeDom(parser.parse('<div k="v"></div>', 'TestComp')))
|
||||
expect(humanizeDom(parser.parse('<div kEy="v" key2=v2></div>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[HtmlAttrAst, 'k', 'v', 'TestComp > div:nth-child(0)[k=v]']
|
||||
[HtmlElementAst, 'div'],
|
||||
[HtmlAttrAst, 'kEy', 'v'],
|
||||
[HtmlAttrAst, 'key2', 'v2'],
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse attributes without values', () => {
|
||||
expect(humanizeDom(parser.parse('<div k></div>', 'TestComp')))
|
||||
.toEqual([[HtmlElementAst, 'div'], [HtmlAttrAst, 'k', '']]);
|
||||
});
|
||||
|
||||
it('should parse attributes on svg elements case sensitive', () => {
|
||||
expect(humanizeDom(parser.parse('<svg viewBox="0"></svg>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'svg', 'TestComp > svg:nth-child(0)'],
|
||||
[HtmlAttrAst, 'viewBox', '0', 'TestComp > svg:nth-child(0)[viewBox=0]']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, '@svg:svg'], [HtmlAttrAst, 'viewBox', '0']]);
|
||||
});
|
||||
|
||||
it('should parse attributes on template elements', () => {
|
||||
expect(humanizeDom(parser.parse('<template k="v"></template>', 'TestComp')))
|
||||
.toEqual([
|
||||
[HtmlElementAst, 'template', 'TestComp > template:nth-child(0)'],
|
||||
[HtmlAttrAst, 'k', 'v', 'TestComp > template:nth-child(0)[k=v]']
|
||||
]);
|
||||
.toEqual([[HtmlElementAst, 'template'], [HtmlAttrAst, 'k', 'v']]);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('unparse', () => {
|
||||
it('should unparse text nodes',
|
||||
() => { expect(parser.unparse(parser.parse('a', null))).toEqual('a'); });
|
||||
|
||||
it('should unparse elements',
|
||||
() => { expect(parser.unparse(parser.parse('<a></a>', null))).toEqual('<a></a>'); });
|
||||
|
||||
it('should unparse attributes', () => {
|
||||
expect(parser.unparse(parser.parse('<div a b="c"></div>', null)))
|
||||
.toEqual('<div a="" b="c"></div>');
|
||||
});
|
||||
|
||||
it('should unparse nested elements', () => {
|
||||
expect(parser.unparse(parser.parse('<div><a></a></div>', null)))
|
||||
.toEqual('<div><a></a></div>');
|
||||
});
|
||||
|
||||
it('should unparse nested text nodes', () => {
|
||||
expect(parser.unparse(parser.parse('<div>a</div>', null))).toEqual('<div>a</div>');
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function humanizeDom(asts: HtmlAst[]): any[] {
|
||||
function humanizeDom(parseResult: HtmlParseTreeResult): any[] {
|
||||
// TODO: humanize errors as well!
|
||||
if (parseResult.errors.length > 0) {
|
||||
throw parseResult.errors;
|
||||
}
|
||||
var humanizer = new Humanizer();
|
||||
htmlVisitAll(humanizer, asts);
|
||||
htmlVisitAll(humanizer, parseResult.rootNodes);
|
||||
return humanizer.result;
|
||||
}
|
||||
|
||||
class Humanizer implements HtmlAstVisitor {
|
||||
result: any[] = [];
|
||||
|
||||
visitElement(ast: HtmlElementAst, context: any): any {
|
||||
this.result.push([HtmlElementAst, ast.name, ast.sourceInfo]);
|
||||
this.result.push([HtmlElementAst, ast.name]);
|
||||
htmlVisitAll(this, ast.attrs);
|
||||
htmlVisitAll(this, ast.children);
|
||||
return null;
|
||||
}
|
||||
|
||||
visitAttr(ast: HtmlAttrAst, context: any): any {
|
||||
this.result.push([HtmlAttrAst, ast.name, ast.value, ast.sourceInfo]);
|
||||
this.result.push([HtmlAttrAst, ast.name, ast.value]);
|
||||
return null;
|
||||
}
|
||||
|
||||
visitText(ast: HtmlTextAst, context: any): any {
|
||||
this.result.push([HtmlTextAst, ast.value, ast.sourceInfo]);
|
||||
this.result.push([HtmlTextAst, ast.value]);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
@ -8,7 +8,7 @@ import {
|
||||
beforeEach,
|
||||
afterEach,
|
||||
inject,
|
||||
beforeEachBindings
|
||||
beforeEachProviders
|
||||
} from 'angular2/testing_internal';
|
||||
import {provide} from 'angular2/src/core/di';
|
||||
|
||||
@ -45,9 +45,12 @@ import {Unparser} from '../core/change_detection/parser/unparser';
|
||||
|
||||
var expressionUnparser = new Unparser();
|
||||
|
||||
// TODO(tbosch): add tests for checking that we
|
||||
// keep the correct sourceSpans!
|
||||
|
||||
export function main() {
|
||||
describe('TemplateParser', () => {
|
||||
beforeEachBindings(() => [
|
||||
beforeEachProviders(() => [
|
||||
TEST_PROVIDERS,
|
||||
provide(ElementSchemaRegistry,
|
||||
{
|
||||
@ -72,29 +75,22 @@ export function main() {
|
||||
describe('parse', () => {
|
||||
describe('nodes without bindings', () => {
|
||||
|
||||
it('should parse text nodes', () => {
|
||||
expect(humanizeTemplateAsts(parse('a', [])))
|
||||
.toEqual([[TextAst, 'a', 'TestComp > #text(a):nth-child(0)']]);
|
||||
});
|
||||
it('should parse text nodes',
|
||||
() => { expect(humanizeTemplateAsts(parse('a', []))).toEqual([[TextAst, 'a']]); });
|
||||
|
||||
it('should parse elements with attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div a=b>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', 'b', 'TestComp > div:nth-child(0)[a=b]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [AttrAst, 'a', 'b']]);
|
||||
});
|
||||
});
|
||||
|
||||
it('should parse ngContent', () => {
|
||||
var parsed = parse('<ng-content select="a">', []);
|
||||
expect(humanizeTemplateAsts(parsed))
|
||||
.toEqual([[NgContentAst, 'TestComp > ng-content:nth-child(0)']]);
|
||||
expect(humanizeTemplateAsts(parsed)).toEqual([[NgContentAst]]);
|
||||
});
|
||||
|
||||
it('should parse bound text nodes', () => {
|
||||
expect(humanizeTemplateAsts(parse('{{a}}', [])))
|
||||
.toEqual([[BoundTextAst, '{{ a }}', 'TestComp > #text({{a}}):nth-child(0)']]);
|
||||
expect(humanizeTemplateAsts(parse('{{a}}', []))).toEqual([[BoundTextAst, '{{ a }}']]);
|
||||
});
|
||||
|
||||
describe('bound properties', () => {
|
||||
@ -102,120 +98,64 @@ export function main() {
|
||||
it('should parse and camel case bound properties', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [some-prop]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'someProp',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[some-prop]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'someProp', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should normalize property names via the element schema', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [mapped-attr]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'mappedProp',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[mapped-attr]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'mappedProp', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse and camel case bound attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [attr.some-attr]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Attribute,
|
||||
'someAttr',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[attr.some-attr]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Attribute, 'someAttr', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse and dash case bound classes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [class.some-class]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Class,
|
||||
'some-class',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[class.some-class]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Class, 'some-class', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse and camel case bound styles', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [style.some-style]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Style,
|
||||
'someStyle',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[style.some-style]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Style, 'someStyle', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse bound properties via [...] and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div [prop]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'prop',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[prop]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'prop', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse bound properties via bind- and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div bind-prop="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'prop',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[bind-prop=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'prop', 'v', null]
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse bound properties via {{...}} and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div prop="{{v}}">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'prop',
|
||||
'{{ v }}',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[prop={{v}}]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'prop', '{{ v }}', null]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -225,46 +165,22 @@ export function main() {
|
||||
|
||||
it('should parse bound events with a target', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div (window:event)="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundEventAst,
|
||||
'event',
|
||||
'window',
|
||||
'v',
|
||||
'TestComp > div:nth-child(0)[(window:event)=v]'
|
||||
]
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [BoundEventAst, 'event', 'window', 'v']]);
|
||||
});
|
||||
|
||||
it('should parse bound events via (...) and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div (event)="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[BoundEventAst, 'event', null, 'v', 'TestComp > div:nth-child(0)[(event)=v]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [BoundEventAst, 'event', null, 'v']]);
|
||||
});
|
||||
|
||||
it('should camel case event names', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div (some-event)="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundEventAst,
|
||||
'someEvent',
|
||||
null,
|
||||
'v',
|
||||
'TestComp > div:nth-child(0)[(some-event)=v]'
|
||||
]
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [BoundEventAst, 'someEvent', null, 'v']]);
|
||||
});
|
||||
|
||||
it('should parse bound events via on- and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div on-event="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[BoundEventAst, 'event', null, 'v', 'TestComp > div:nth-child(0)[on-event=v]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [BoundEventAst, 'event', null, 'v']]);
|
||||
});
|
||||
|
||||
it('should allow events on explicit embedded templates that are emitted by a directive',
|
||||
@ -276,9 +192,9 @@ export function main() {
|
||||
});
|
||||
expect(humanizeTemplateAsts(parse('<template (e)="f"></template>', [dirA])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > template:nth-child(0)'],
|
||||
[BoundEventAst, 'e', null, 'f', 'TestComp > template:nth-child(0)[(e)=f]'],
|
||||
[DirectiveAst, dirA, 'TestComp > template:nth-child(0)'],
|
||||
[EmbeddedTemplateAst],
|
||||
[BoundEventAst, 'e', null, 'f'],
|
||||
[DirectiveAst, dirA],
|
||||
]);
|
||||
});
|
||||
});
|
||||
@ -288,22 +204,9 @@ export function main() {
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(parse('<div [(prop)]="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'prop',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[(prop)]=v]'
|
||||
],
|
||||
[
|
||||
BoundEventAst,
|
||||
'propChange',
|
||||
null,
|
||||
'v = $event',
|
||||
'TestComp > div:nth-child(0)[[(prop)]=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'prop', 'v', null],
|
||||
[BoundEventAst, 'propChange', null, 'v = $event']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -311,22 +214,9 @@ export function main() {
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(parse('<div bindon-prop="v">', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'prop',
|
||||
'v',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[bindon-prop=v]'
|
||||
],
|
||||
[
|
||||
BoundEventAst,
|
||||
'propChange',
|
||||
null,
|
||||
'v = $event',
|
||||
'TestComp > div:nth-child(0)[bindon-prop=v]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'prop', 'v', null],
|
||||
[BoundEventAst, 'propChange', null, 'v = $event']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -349,14 +239,14 @@ export function main() {
|
||||
});
|
||||
expect(humanizeTemplateAsts(parse('<div a c b>', [dirA, dirB, dirC, comp])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', '', 'TestComp > div:nth-child(0)[a=]'],
|
||||
[AttrAst, 'b', '', 'TestComp > div:nth-child(0)[b=]'],
|
||||
[AttrAst, 'c', '', 'TestComp > div:nth-child(0)[c=]'],
|
||||
[DirectiveAst, comp, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirB, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirC, 'TestComp > div:nth-child(0)']
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'a', ''],
|
||||
[AttrAst, 'c', ''],
|
||||
[AttrAst, 'b', ''],
|
||||
[DirectiveAst, comp],
|
||||
[DirectiveAst, dirA],
|
||||
[DirectiveAst, dirB],
|
||||
[DirectiveAst, dirC]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -367,16 +257,9 @@ export function main() {
|
||||
{selector: '[b]', type: new CompileTypeMetadata({name: 'DirB'})});
|
||||
expect(humanizeTemplateAsts(parse('<div [a]="b">', [dirA, dirB])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'a',
|
||||
'b',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)[[a]=b]'
|
||||
],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)']
|
||||
[ElementAst, 'div'],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'a', 'b', null],
|
||||
[DirectiveAst, dirA]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -388,16 +271,9 @@ export function main() {
|
||||
});
|
||||
expect(humanizeTemplateAsts(parse('<div></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundElementPropertyAst,
|
||||
PropertyBindingType.Property,
|
||||
'a',
|
||||
'expr',
|
||||
null,
|
||||
'TestComp > div:nth-child(0)'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundElementPropertyAst, PropertyBindingType.Property, 'a', 'expr', null]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -408,11 +284,8 @@ export function main() {
|
||||
host: {'(a)': 'expr'}
|
||||
});
|
||||
expect(humanizeTemplateAsts(parse('<div></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[BoundEventAst, 'a', null, 'expr', 'TestComp > div:nth-child(0)']
|
||||
]);
|
||||
.toEqual(
|
||||
[[ElementAst, 'div'], [DirectiveAst, dirA], [BoundEventAst, 'a', null, 'expr']]);
|
||||
});
|
||||
|
||||
it('should parse directive properties', () => {
|
||||
@ -420,14 +293,9 @@ export function main() {
|
||||
{selector: 'div', type: new CompileTypeMetadata({name: 'DirA'}), inputs: ['aProp']});
|
||||
expect(humanizeTemplateAsts(parse('<div [a-prop]="expr"></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'aProp',
|
||||
'expr',
|
||||
'TestComp > div:nth-child(0)[[a-prop]=expr]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundDirectivePropertyAst, 'aProp', 'expr']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -436,9 +304,9 @@ export function main() {
|
||||
{selector: 'div', type: new CompileTypeMetadata({name: 'DirA'}), inputs: ['b:a']});
|
||||
expect(humanizeTemplateAsts(parse('<div [a]="expr"></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[BoundDirectivePropertyAst, 'b', 'expr', 'TestComp > div:nth-child(0)[[a]=expr]']
|
||||
[ElementAst, 'div'],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundDirectivePropertyAst, 'b', 'expr']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -447,15 +315,10 @@ export function main() {
|
||||
{selector: 'div', type: new CompileTypeMetadata({name: 'DirA'}), inputs: ['a']});
|
||||
expect(humanizeTemplateAsts(parse('<div a="literal"></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', 'literal', 'TestComp > div:nth-child(0)[a=literal]'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'a',
|
||||
'"literal"',
|
||||
'TestComp > div:nth-child(0)[a=literal]'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'a', 'literal'],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundDirectivePropertyAst, 'a', '"literal"']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -464,15 +327,10 @@ export function main() {
|
||||
{selector: 'div', type: new CompileTypeMetadata({name: 'DirA'}), inputs: ['a']});
|
||||
expect(humanizeTemplateAsts(parse('<div a="literal" [a]="\'literal2\'"></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', 'literal', 'TestComp > div:nth-child(0)[a=literal]'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'a',
|
||||
'"literal2"',
|
||||
'TestComp > div:nth-child(0)[[a]=\'literal2\']'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'a', 'literal'],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundDirectivePropertyAst, 'a', '"literal2"']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -480,10 +338,7 @@ export function main() {
|
||||
var dirA = CompileDirectiveMetadata.create(
|
||||
{selector: 'div', type: new CompileTypeMetadata({name: 'DirA'}), inputs: ['a']});
|
||||
expect(humanizeTemplateAsts(parse('<div></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [DirectiveAst, dirA]]);
|
||||
});
|
||||
|
||||
});
|
||||
@ -492,34 +347,22 @@ export function main() {
|
||||
|
||||
it('should parse variables via #... and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div #a>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', '', 'TestComp > div:nth-child(0)[#a=]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
|
||||
});
|
||||
|
||||
it('should parse variables via var-... and not report them as attributes', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div var-a>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', '', 'TestComp > div:nth-child(0)[var-a=]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
|
||||
});
|
||||
|
||||
it('should camel case variables', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div var-some-a>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'someA', '', 'TestComp > div:nth-child(0)[var-some-a=]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [VariableAst, 'someA', '']]);
|
||||
});
|
||||
|
||||
it('should assign variables with empty value to the element', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div #a></div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', '', 'TestComp > div:nth-child(0)[#a=]']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [VariableAst, 'a', '']]);
|
||||
});
|
||||
|
||||
it('should assign variables to directives via exportAs', () => {
|
||||
@ -527,25 +370,22 @@ export function main() {
|
||||
{selector: '[a]', type: new CompileTypeMetadata({name: 'DirA'}), exportAs: 'dirA'});
|
||||
expect(humanizeTemplateAsts(parse('<div a #a="dirA"></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', '', 'TestComp > div:nth-child(0)[a=]'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', 'dirA', 'TestComp > div:nth-child(0)[#a=dirA]']
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'a', ''],
|
||||
[DirectiveAst, dirA],
|
||||
[VariableAst, 'a', 'dirA']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should report variables with values that dont match a directive as errors', () => {
|
||||
expect(() => parse('<div #a="dirA"></div>', [])).toThrowError(`Template parse errors:
|
||||
There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(0)[#a=dirA]`);
|
||||
There is no directive with "exportAs" set to "dirA" (<div #a="dirA">): TestComp@0:5`);
|
||||
});
|
||||
|
||||
it('should allow variables with values that dont match a directive on embedded template elements',
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(parse('<template #a="b"></template>', [])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > template:nth-child(0)'],
|
||||
[VariableAst, 'a', 'b', 'TestComp > template:nth-child(0)[#a=b]']
|
||||
]);
|
||||
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b']]);
|
||||
});
|
||||
|
||||
it('should assign variables with empty value to components', () => {
|
||||
@ -558,11 +398,11 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
});
|
||||
expect(humanizeTemplateAsts(parse('<div a #a></div>', [dirA])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'a', '', 'TestComp > div:nth-child(0)[a=]'],
|
||||
[VariableAst, 'a', '', 'TestComp > div:nth-child(0)[#a=]'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', '', 'TestComp > div:nth-child(0)[#a=]']
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'a', ''],
|
||||
[VariableAst, 'a', ''],
|
||||
[DirectiveAst, dirA],
|
||||
[VariableAst, 'a', '']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -571,50 +411,34 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
describe('explicit templates', () => {
|
||||
it('should create embedded templates for <template> elements', () => {
|
||||
expect(humanizeTemplateAsts(parse('<template></template>', [])))
|
||||
.toEqual([[EmbeddedTemplateAst, 'TestComp > template:nth-child(0)']]);
|
||||
.toEqual([[EmbeddedTemplateAst]]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('inline templates', () => {
|
||||
it('should wrap the element into an EmbeddedTemplateAST', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div template>', [])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[EmbeddedTemplateAst], [ElementAst, 'div']]);
|
||||
});
|
||||
|
||||
it('should parse bound properties', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div template="ngIf test">', [ngIf])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, ngIf, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'ngIf',
|
||||
'test',
|
||||
'TestComp > div:nth-child(0)[template=ngIf test]'
|
||||
],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
[EmbeddedTemplateAst],
|
||||
[DirectiveAst, ngIf],
|
||||
[BoundDirectivePropertyAst, 'ngIf', 'test'],
|
||||
[ElementAst, 'div']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should parse variables via #...', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div template="ngIf #a=b">', [])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', 'b', 'TestComp > div:nth-child(0)[template=ngIf #a=b]'],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
|
||||
});
|
||||
|
||||
it('should parse variables via var ...', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div template="ngIf var a=b">', [])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', 'b', 'TestComp > div:nth-child(0)[template=ngIf var a=b]'],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
]);
|
||||
.toEqual([[EmbeddedTemplateAst], [VariableAst, 'a', 'b'], [ElementAst, 'div']]);
|
||||
});
|
||||
|
||||
describe('directives', () => {
|
||||
@ -625,17 +449,12 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
{selector: '[b]', type: new CompileTypeMetadata({name: 'DirB'})});
|
||||
expect(humanizeTemplateAsts(parse('<div template="a b" b>', [dirA, dirB])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'a',
|
||||
'b',
|
||||
'TestComp > div:nth-child(0)[template=a b]'
|
||||
],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'b', '', 'TestComp > div:nth-child(0)[b=]'],
|
||||
[DirectiveAst, dirB, 'TestComp > div:nth-child(0)']
|
||||
[EmbeddedTemplateAst],
|
||||
[DirectiveAst, dirA],
|
||||
[BoundDirectivePropertyAst, 'a', 'b'],
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'b', ''],
|
||||
[DirectiveAst, dirB]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -646,12 +465,12 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
{selector: '[b]', type: new CompileTypeMetadata({name: 'DirB'})});
|
||||
expect(humanizeTemplateAsts(parse('<div template="#a=b" b>', [dirA, dirB])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[VariableAst, 'a', 'b', 'TestComp > div:nth-child(0)[template=#a=b]'],
|
||||
[DirectiveAst, dirA, 'TestComp > div:nth-child(0)'],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'b', '', 'TestComp > div:nth-child(0)[b=]'],
|
||||
[DirectiveAst, dirB, 'TestComp > div:nth-child(0)']
|
||||
[EmbeddedTemplateAst],
|
||||
[VariableAst, 'a', 'b'],
|
||||
[DirectiveAst, dirA],
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'b', ''],
|
||||
[DirectiveAst, dirB]
|
||||
]);
|
||||
});
|
||||
|
||||
@ -660,30 +479,23 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
it('should work with *... and use the attribute name as property binding name', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div *ng-if="test">', [ngIf])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, ngIf, 'TestComp > div:nth-child(0)'],
|
||||
[
|
||||
BoundDirectivePropertyAst,
|
||||
'ngIf',
|
||||
'test',
|
||||
'TestComp > div:nth-child(0)[*ng-if=test]'
|
||||
],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
[EmbeddedTemplateAst],
|
||||
[DirectiveAst, ngIf],
|
||||
[BoundDirectivePropertyAst, 'ngIf', 'test'],
|
||||
[ElementAst, 'div']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should work with *... and empty value', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div *ng-if>', [ngIf])))
|
||||
.toEqual([
|
||||
[EmbeddedTemplateAst, 'TestComp > div:nth-child(0)'],
|
||||
[DirectiveAst, ngIf, 'TestComp > div:nth-child(0)'],
|
||||
[BoundDirectivePropertyAst, 'ngIf', 'null', 'TestComp > div:nth-child(0)[*ng-if=]'],
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)']
|
||||
[EmbeddedTemplateAst],
|
||||
[DirectiveAst, ngIf],
|
||||
[BoundDirectivePropertyAst, 'ngIf', 'null'],
|
||||
[ElementAst, 'div']
|
||||
]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
describe('content projection', () => {
|
||||
@ -788,14 +600,14 @@ There is no directive with "exportAs" set to "dirA" at TestComp > div:nth-child(
|
||||
});
|
||||
|
||||
describe('error cases', () => {
|
||||
it('should throw on invalid property names', () => {
|
||||
it('should report invalid property names', () => {
|
||||
expect(() => parse('<div [invalid-prop]></div>', [])).toThrowError(`Template parse errors:
|
||||
Can't bind to 'invalidProp' since it isn't a known native property in TestComp > div:nth-child(0)[[invalid-prop]=]`);
|
||||
Can't bind to 'invalidProp' since it isn't a known native property (<div [invalid-prop]>): TestComp@0:5`);
|
||||
});
|
||||
|
||||
it('should report errors in expressions', () => {
|
||||
expect(() => parse('<div [prop]="a b"></div>', [])).toThrowErrorWith(`Template parse errors:
|
||||
Parser Error: Unexpected token 'b' at column 3 in [a b] in TestComp > div:nth-child(0)[[prop]=a b]`);
|
||||
Parser Error: Unexpected token 'b' at column 3 in [a b] in TestComp@0:5 in [prop]="a b": TestComp@0:5`);
|
||||
});
|
||||
|
||||
it('should not throw on invalid property names if the property is used by a directive',
|
||||
@ -821,8 +633,8 @@ Parser Error: Unexpected token 'b' at column 3 in [a b] in TestComp > div:nth-ch
|
||||
type: new CompileTypeMetadata({name: 'DirB'}),
|
||||
template: new CompileTemplateMetadata({ngContentSelectors: []})
|
||||
});
|
||||
expect(() => parse('<div>', [dirB, dirA])).toThrowError(`Template parse errors:
|
||||
More than one component: DirB,DirA in TestComp > div:nth-child(0)`);
|
||||
expect(() => parse('<div/>', [dirB, dirA])).toThrowError(`Template parse errors:
|
||||
More than one component: DirB,DirA in <div/>: TestComp@0:0`);
|
||||
});
|
||||
|
||||
it('should not allow components or element bindings nor dom events on explicit embedded templates',
|
||||
@ -847,23 +659,20 @@ Property binding a not used by any directive on an embedded template in TestComp
|
||||
type: new CompileTypeMetadata({name: 'DirA'}),
|
||||
template: new CompileTemplateMetadata({ngContentSelectors: []})
|
||||
});
|
||||
expect(() => parse('<div *a="b">', [dirA])).toThrowError(`Template parse errors:
|
||||
Components on an embedded template: DirA in TestComp > div:nth-child(0)
|
||||
Property binding a not used by any directive on an embedded template in TestComp > div:nth-child(0)[*a=b]`);
|
||||
expect(() => parse('<div *a="b"></div>', [dirA])).toThrowError(`Template parse errors:
|
||||
Components on an embedded template: DirA in <div *a="b">: TestComp@0:0
|
||||
Property binding a not used by any directive on an embedded template in <div *a="b">: TestComp@0:0`);
|
||||
});
|
||||
});
|
||||
|
||||
describe('ignore elements', () => {
|
||||
it('should ignore <script> elements but include them for source info', () => {
|
||||
expect(humanizeTemplateAsts(parse('<script></script>a', [])))
|
||||
.toEqual([[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']]);
|
||||
it('should ignore <script> elements', () => {
|
||||
expect(humanizeTemplateAsts(parse('<script></script>a', []))).toEqual([[TextAst, 'a']]);
|
||||
|
||||
});
|
||||
|
||||
it('should ignore <style> elements but include them for source info', () => {
|
||||
expect(humanizeTemplateAsts(parse('<style></style>a', [])))
|
||||
.toEqual([[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']]);
|
||||
|
||||
it('should ignore <style> elements', () => {
|
||||
expect(humanizeTemplateAsts(parse('<style></style>a', []))).toEqual([[TextAst, 'a']]);
|
||||
});
|
||||
|
||||
describe('<link rel="stylesheet">', () => {
|
||||
@ -873,108 +682,73 @@ Property binding a not used by any directive on an embedded template in TestComp
|
||||
expect(humanizeTemplateAsts(
|
||||
parse('<link rel="stylesheet" href="http://someurl"></link>a', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'link', 'TestComp > link:nth-child(0)'],
|
||||
[
|
||||
AttrAst,
|
||||
'href',
|
||||
'http://someurl',
|
||||
'TestComp > link:nth-child(0)[href=http://someurl]'
|
||||
],
|
||||
[AttrAst, 'rel', 'stylesheet', 'TestComp > link:nth-child(0)[rel=stylesheet]'],
|
||||
[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']
|
||||
[ElementAst, 'link'],
|
||||
[AttrAst, 'href', 'http://someurl'],
|
||||
[AttrAst, 'rel', 'stylesheet'],
|
||||
[TextAst, 'a']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should keep <link rel="stylesheet"> elements if they have no uri', () => {
|
||||
expect(humanizeTemplateAsts(parse('<link rel="stylesheet"></link>a', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'link', 'TestComp > link:nth-child(0)'],
|
||||
[AttrAst, 'rel', 'stylesheet', 'TestComp > link:nth-child(0)[rel=stylesheet]'],
|
||||
[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'link'], [AttrAst, 'rel', 'stylesheet'], [TextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should ignore <link rel="stylesheet"> elements if they have a relative uri', () => {
|
||||
expect(
|
||||
humanizeTemplateAsts(parse('<link rel="stylesheet" href="./other.css"></link>a', [])))
|
||||
.toEqual([[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']]);
|
||||
.toEqual([[TextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should ignore <link rel="stylesheet"> elements if they have a package: uri', () => {
|
||||
expect(humanizeTemplateAsts(
|
||||
parse('<link rel="stylesheet" href="package:somePackage"></link>a', [])))
|
||||
.toEqual([[TextAst, 'a', 'TestComp > #text(a):nth-child(1)']]);
|
||||
.toEqual([[TextAst, 'a']]);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
it('should ignore bindings on children of elements with ng-non-bindable', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable>{{b}}</div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[TextAst, '{{b}}', 'TestComp > div:nth-child(0) > #text({{b}}):nth-child(0)']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [AttrAst, 'ng-non-bindable', ''], [TextAst, '{{b}}']]);
|
||||
});
|
||||
|
||||
it('should keep nested children of elements with ng-non-bindable', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable><span>{{b}}</span></div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[ElementAst, 'span', 'TestComp > div:nth-child(0) > span:nth-child(0)'],
|
||||
[
|
||||
TextAst,
|
||||
'{{b}}',
|
||||
'TestComp > div:nth-child(0) > span:nth-child(0) > #text({{b}}):nth-child(0)'
|
||||
]
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'ng-non-bindable', ''],
|
||||
[ElementAst, 'span'],
|
||||
[TextAst, '{{b}}']
|
||||
]);
|
||||
});
|
||||
|
||||
it('should ignore <script> elements inside of elements with ng-non-bindable but include them for source info',
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable><script></script>a</div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[TextAst, 'a', 'TestComp > div:nth-child(0) > #text(a):nth-child(1)']
|
||||
]);
|
||||
});
|
||||
it('should ignore <script> elements inside of elements with ng-non-bindable', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable><script></script>a</div>', [])))
|
||||
.toEqual([[ElementAst, 'div'], [AttrAst, 'ng-non-bindable', ''], [TextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should ignore <style> elements inside of elements with ng-non-bindable but include them for source info',
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable><style></style>a</div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[TextAst, 'a', 'TestComp > div:nth-child(0) > #text(a):nth-child(1)']
|
||||
]);
|
||||
});
|
||||
it('should ignore <style> elements inside of elements with ng-non-bindable', () => {
|
||||
expect(humanizeTemplateAsts(parse('<div ng-non-bindable><style></style>a</div>', [])))
|
||||
.toEqual([[ElementAst, 'div'], [AttrAst, 'ng-non-bindable', ''], [TextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should ignore <link rel="stylesheet"> elements inside of elements with ng-non-bindable but include them for source info',
|
||||
it('should ignore <link rel="stylesheet"> elements inside of elements with ng-non-bindable',
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(
|
||||
parse('<div ng-non-bindable><link rel="stylesheet"></link>a</div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[TextAst, 'a', 'TestComp > div:nth-child(0) > #text(a):nth-child(1)']
|
||||
]);
|
||||
.toEqual([[ElementAst, 'div'], [AttrAst, 'ng-non-bindable', ''], [TextAst, 'a']]);
|
||||
});
|
||||
|
||||
it('should convert <ng-content> elements into regular elements inside of elements with ng-non-bindable but include them for source info',
|
||||
it('should convert <ng-content> elements into regular elements inside of elements with ng-non-bindable',
|
||||
() => {
|
||||
expect(humanizeTemplateAsts(
|
||||
parse('<div ng-non-bindable><ng-content></ng-content>a</div>', [])))
|
||||
.toEqual([
|
||||
[ElementAst, 'div', 'TestComp > div:nth-child(0)'],
|
||||
[AttrAst, 'ng-non-bindable', '', 'TestComp > div:nth-child(0)[ng-non-bindable=]'],
|
||||
[
|
||||
ElementAst,
|
||||
'ng-content',
|
||||
'TestComp > div:nth-child(0) > ng-content:nth-child(0)'
|
||||
],
|
||||
[TextAst, 'a', 'TestComp > div:nth-child(0) > #text(a):nth-child(1)']
|
||||
[ElementAst, 'div'],
|
||||
[AttrAst, 'ng-non-bindable', ''],
|
||||
[ElementAst, 'ng-content'],
|
||||
[TextAst, 'a']
|
||||
]);
|
||||
});
|
||||
|
||||
@ -991,11 +765,11 @@ export function humanizeTemplateAsts(templateAsts: TemplateAst[]): any[] {
|
||||
class TemplateHumanizer implements TemplateAstVisitor {
|
||||
result: any[] = [];
|
||||
visitNgContent(ast: NgContentAst, context: any): any {
|
||||
this.result.push([NgContentAst, ast.sourceInfo]);
|
||||
this.result.push([NgContentAst]);
|
||||
return null;
|
||||
}
|
||||
visitEmbeddedTemplate(ast: EmbeddedTemplateAst, context: any): any {
|
||||
this.result.push([EmbeddedTemplateAst, ast.sourceInfo]);
|
||||
this.result.push([EmbeddedTemplateAst]);
|
||||
templateVisitAll(this, ast.attrs);
|
||||
templateVisitAll(this, ast.outputs);
|
||||
templateVisitAll(this, ast.vars);
|
||||
@ -1004,7 +778,7 @@ class TemplateHumanizer implements TemplateAstVisitor {
|
||||
return null;
|
||||
}
|
||||
visitElement(ast: ElementAst, context: any): any {
|
||||
this.result.push([ElementAst, ast.name, ast.sourceInfo]);
|
||||
this.result.push([ElementAst, ast.name]);
|
||||
templateVisitAll(this, ast.attrs);
|
||||
templateVisitAll(this, ast.inputs);
|
||||
templateVisitAll(this, ast.outputs);
|
||||
@ -1014,17 +788,12 @@ class TemplateHumanizer implements TemplateAstVisitor {
|
||||
return null;
|
||||
}
|
||||
visitVariable(ast: VariableAst, context: any): any {
|
||||
this.result.push([VariableAst, ast.name, ast.value, ast.sourceInfo]);
|
||||
this.result.push([VariableAst, ast.name, ast.value]);
|
||||
return null;
|
||||
}
|
||||
visitEvent(ast: BoundEventAst, context: any): any {
|
||||
this.result.push([
|
||||
BoundEventAst,
|
||||
ast.name,
|
||||
ast.target,
|
||||
expressionUnparser.unparse(ast.handler),
|
||||
ast.sourceInfo
|
||||
]);
|
||||
this.result.push(
|
||||
[BoundEventAst, ast.name, ast.target, expressionUnparser.unparse(ast.handler)]);
|
||||
return null;
|
||||
}
|
||||
visitElementProperty(ast: BoundElementPropertyAst, context: any): any {
|
||||
@ -1033,25 +802,24 @@ class TemplateHumanizer implements TemplateAstVisitor {
|
||||
ast.type,
|
||||
ast.name,
|
||||
expressionUnparser.unparse(ast.value),
|
||||
ast.unit,
|
||||
ast.sourceInfo
|
||||
ast.unit
|
||||
]);
|
||||
return null;
|
||||
}
|
||||
visitAttr(ast: AttrAst, context: any): any {
|
||||
this.result.push([AttrAst, ast.name, ast.value, ast.sourceInfo]);
|
||||
this.result.push([AttrAst, ast.name, ast.value]);
|
||||
return null;
|
||||
}
|
||||
visitBoundText(ast: BoundTextAst, context: any): any {
|
||||
this.result.push([BoundTextAst, expressionUnparser.unparse(ast.value), ast.sourceInfo]);
|
||||
this.result.push([BoundTextAst, expressionUnparser.unparse(ast.value)]);
|
||||
return null;
|
||||
}
|
||||
visitText(ast: TextAst, context: any): any {
|
||||
this.result.push([TextAst, ast.value, ast.sourceInfo]);
|
||||
this.result.push([TextAst, ast.value]);
|
||||
return null;
|
||||
}
|
||||
visitDirective(ast: DirectiveAst, context: any): any {
|
||||
this.result.push([DirectiveAst, ast.directive, ast.sourceInfo]);
|
||||
this.result.push([DirectiveAst, ast.directive]);
|
||||
templateVisitAll(this, ast.inputs);
|
||||
templateVisitAll(this, ast.hostProperties);
|
||||
templateVisitAll(this, ast.hostEvents);
|
||||
@ -1059,16 +827,16 @@ class TemplateHumanizer implements TemplateAstVisitor {
|
||||
return null;
|
||||
}
|
||||
visitDirectiveProperty(ast: BoundDirectivePropertyAst, context: any): any {
|
||||
this.result.push([
|
||||
BoundDirectivePropertyAst,
|
||||
ast.directiveName,
|
||||
expressionUnparser.unparse(ast.value),
|
||||
ast.sourceInfo
|
||||
]);
|
||||
this.result.push(
|
||||
[BoundDirectivePropertyAst, ast.directiveName, expressionUnparser.unparse(ast.value)]);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function sourceInfo(ast: TemplateAst): string {
|
||||
return `${ast.sourceSpan}: ${ast.sourceSpan.start}`;
|
||||
}
|
||||
|
||||
function humanizeContentProjection(templateAsts: TemplateAst[]): any[] {
|
||||
var humanizer = new TemplateContentProjectionHumanizer();
|
||||
templateVisitAll(humanizer, templateAsts);
|
||||
|
||||
@ -26,7 +26,7 @@ export function main() {
|
||||
beforeEach(inject([HtmlParser], (_htmlParser: HtmlParser) => { htmlParser = _htmlParser; }));
|
||||
|
||||
function preparse(html: string): PreparsedElement {
|
||||
return preparseElement(htmlParser.parse(html, '')[0]);
|
||||
return preparseElement(htmlParser.parse(html, '').rootNodes[0]);
|
||||
}
|
||||
|
||||
it('should detect script elements', inject([HtmlParser], (htmlParser: HtmlParser) => {
|
||||
|
||||
Reference in New Issue
Block a user