cargdev/angular
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

docs(core): in template syntax guide, make SVG example more clear (#31356)

Browse Source 
add e2e test for SVG template example
fix template syntax example app
- linting errors
- runtime exceptions
- template type errors
- deprecated type casting
- deprecated currency pipe example

Relates to #30559

PR Close #31356
This commit is contained in:
Michael Prentice
2019-06-30 02:34:15 -04:00
committed by Alex Rickabaugh
parent 95a9d67599
commit 09970d52e8
9 changed files with 67 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
aio/content/examples/template-syntax/e2e/src/app.e2e-spec.ts
View File

@ -2,42 +2,49 @@
import { browser, element, by } from 'protractor';
// Not yet complete
describe('Template Syntax', function () {
// TODO Not yet complete
describe('Template Syntax', () => {
beforeAll(function () {
beforeAll(() => {
browser.get('');
});
it('should be able to use interpolation with a hero', function () {
let heroInterEle = element.all(by.css('h2+p')).get(0);
it('should be able to use interpolation with a hero', () => {
const heroInterEle = element.all(by.css('h2+p')).get(0);
expect(heroInterEle.getText()).toEqual('My current hero is Hercules');
});
it('should be able to use interpolation with a calculation', function () {
let theSumEles = element.all(by.cssContainingText('h3~p', 'The sum of'));
it('should be able to use interpolation with a calculation', () => {
const theSumEles = element.all(by.cssContainingText('h3~p', 'The sum of'));
expect(theSumEles.count()).toBe(2);
expect(theSumEles.get(0).getText()).toEqual('The sum of 1 + 1 is 2');
expect(theSumEles.get(1).getText()).toEqual('The sum of 1 + 1 is not 4');
});
it('should be able to use class binding syntax', function () {
let specialEle = element(by.cssContainingText('div', 'Special'));
it('should be able to use class binding syntax', () => {
const specialEle = element(by.cssContainingText('div', 'Special'));
expect(specialEle.getAttribute('class')).toMatch('special');
});
it('should be able to use style binding syntax', function () {
let specialButtonEle = element(by.cssContainingText('div.special~button', 'button'));
it('should be able to use style binding syntax', () => {
const specialButtonEle = element(by.cssContainingText('div.special~button', 'button'));
expect(specialButtonEle.getAttribute('style')).toMatch('color: red');
});
it('should two-way bind to sizer', async () => {
let div = element(by.css('div#two-way-1'));
let incButton = div.element(by.buttonText('+'));
let input = div.element(by.css('input'));
let initSize = await input.getAttribute('value');
const div = element(by.css('div#two-way-1'));
const incButton = div.element(by.buttonText('+'));
const input = div.element(by.css('input'));
const initSize = await input.getAttribute('value');
incButton.click();
expect(input.getAttribute('value')).toEqual((+initSize + 1).toString());
});
});
it('should change SVG rectangle\'s fill color on click', async () => {
const div = element(by.css('app-svg'));
const colorSquare = div.element(by.css('rect'));
const initialColor = await colorSquare.getAttribute('fill');
colorSquare.click();
expect(colorSquare.getAttribute('fill')).not.toEqual(initialColor);
});
});