diff --git a/packages/core/src/render3/instructions.ts b/packages/core/src/render3/instructions.ts index 5e746db8dd..531c7bc3f8 100644 --- a/packages/core/src/render3/instructions.ts +++ b/packages/core/src/render3/instructions.ts @@ -1515,7 +1515,7 @@ export function elementStyling( * * This method lazily creates the `StylingContext`. This is because in most cases * we have styling without any bindings. Creating `StylingContext` eagerly would mean that - * every style declaration such as `
` would result `StyleContext` + * every style declaration such as `
` would result `StyleContext` * which would create unnecessary memory pressure. * * @param index Index of the style allocation. See: `elementStyling`. diff --git a/packages/core/test/render3/compiler_canonical/elements_spec.ts b/packages/core/test/render3/compiler_canonical/elements_spec.ts index 2a9ccecd20..bab358528f 100644 --- a/packages/core/test/render3/compiler_canonical/elements_spec.ts +++ b/packages/core/test/render3/compiler_canonical/elements_spec.ts @@ -6,9 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {browserDetection} from '@angular/platform-browser/testing/src/browser_util'; - -import {ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ContentChildren, Directive, HostBinding, HostListener, Injectable, Input, NgModule, OnDestroy, Optional, Pipe, PipeTransform, QueryList, SimpleChanges, TemplateRef, ViewChild, ViewChildren, ViewContainerRef} from '../../../src/core'; +import {Component} from '../../../src/core'; import * as $r3$ from '../../../src/core_render3_private_export'; import {AttributeMarker} from '../../../src/render3'; import {ComponentDefInternal, InitialStylingFlags} from '../../../src/render3/interfaces/definition'; @@ -353,20 +351,12 @@ describe('elements', () => { } const comp = renderComponent(MyComponent); - if (browserDetection.isIE) { - expect(toHtml(comp)).toEqual('
'); - } else { - expect(toHtml(comp)).toEqual('
'); - } + expect(toHtml(comp)).toEqual('
'); comp.someColor = 'blue'; comp.someWidth = 100; $r3$.ɵdetectChanges(comp); - if (browserDetection.isIE) { - expect(toHtml(comp)).toEqual('
'); - } else { - expect(toHtml(comp)).toEqual('
'); - } + expect(toHtml(comp)).toEqual('
'); }); it('should bind to many and keep order', () => { diff --git a/packages/core/test/render3/instructions_spec.ts b/packages/core/test/render3/instructions_spec.ts index f7e485702c..f1ce2a83bc 100644 --- a/packages/core/test/render3/instructions_spec.ts +++ b/packages/core/test/render3/instructions_spec.ts @@ -244,7 +244,7 @@ describe('instructions', () => { elementStylingMap(0, null, {'background-color': 'red'}); elementStylingApply(0); }); - expect(fixture.html).toEqual('
'); + expect(fixture.html).toEqual('
'); }); it('should sanitize new styles that may contain `url` properties', () => { diff --git a/packages/core/test/render3/styling_spec.ts b/packages/core/test/render3/styling_spec.ts index e84893aedd..e2d8a52ea9 100644 --- a/packages/core/test/render3/styling_spec.ts +++ b/packages/core/test/render3/styling_spec.ts @@ -168,11 +168,11 @@ describe('styling', () => { expect(renderToHtml( Template, {myStyles: {width: '200px', height: '200px'}, myWidth: '300px'}, 1)) - .toEqual(''); + .toEqual(''); expect( renderToHtml(Template, {myStyles: {width: '200px', height: null}, myWidth: null}, 1)) - .toEqual(''); + .toEqual(''); }); }); diff --git a/packages/platform-browser/testing/src/browser_util.ts b/packages/platform-browser/testing/src/browser_util.ts index 221c924fe9..e5d7360da6 100644 --- a/packages/platform-browser/testing/src/browser_util.ts +++ b/packages/platform-browser/testing/src/browser_util.ts @@ -100,14 +100,19 @@ export function stringifyElement(el: any /** TODO #9100 */): string { // Attributes in an ordered way const attributeMap = getDOM().attributeMap(el); - const keys: string[] = Array.from(attributeMap.keys()).sort(); - for (let i = 0; i < keys.length; i++) { - const key = keys[i]; - const attValue = attributeMap.get(key); + const sortedKeys = Array.from(attributeMap.keys()).sort(); + for (const key of sortedKeys) { const lowerCaseKey = key.toLowerCase(); + let attValue = attributeMap.get(key); + if (typeof attValue !== 'string') { result += ` ${lowerCaseKey}`; } else { + // Browsers order style rules differently. Order them alphabetically for consistency. + if (lowerCaseKey === 'style') { + attValue = attValue.split(/; ?/).filter(s => !!s).sort().map(s => `${s};`).join(' '); + } + result += ` ${lowerCaseKey}="${attValue}"`; } } diff --git a/scripts/ci/env.sh b/scripts/ci/env.sh index 3463fbc230..faff459642 100755 --- a/scripts/ci/env.sh +++ b/scripts/ci/env.sh @@ -38,8 +38,8 @@ setEnvVar NODE_VERSION 8.9.1 setEnvVar YARN_VERSION 1.3.2 # Pin to a Chromium version that does not cause the aio e2e tests to flake. (See https://github.com/angular/angular/pull/20403.) # Revision 494239 (which was part of Chrome 62.0.3186.0) is the last version that does not cause flakes. (Latest revision checked: 508578) -setEnvVar CHROMIUM_VERSION 494239 # Chrome 62 linux stable, see https://www.chromium.org/developers/calendar -setEnvVar CHROMEDRIVER_VERSION_ARG "--versions.chrome 2.33" +setEnvVar CHROMIUM_VERSION 561733 # Chrome 68 linux stable, see https://www.chromium.org/developers/calendar +setEnvVar CHROMEDRIVER_VERSION_ARG "--versions.chrome 2.41" setEnvVar SAUCE_CONNECT_VERSION 4.4.9 setEnvVar ANGULAR_CLI_VERSION 1.6.3 setEnvVar PROJECT_ROOT $(cd ${thisDir}/../..; pwd) diff --git a/scripts/ci/install-chromium.sh b/scripts/ci/install-chromium.sh index c18f3c9f7f..627d915694 100755 --- a/scripts/ci/install-chromium.sh +++ b/scripts/ci/install-chromium.sh @@ -80,5 +80,5 @@ if [[ "$EXISTING_VERSION" != "$CHROMIUM_VERSION" ]]; then fi if [[ "$CHROMIUM_VERSION" != "$LATEST_CHROMIUM_VERSION" ]]; then - echo "New version of Chromium available. Update install-chromium.sh with build number: ${LATEST_CHROMIUM_VERSION}" + echo "New version of Chromium available. Update 'scripts/ci/env.sh' with build number: $LATEST_CHROMIUM_VERSION" fi