refactor(upgrade): unify spec code (#12190)
- replace all variable declarations using 'var' by 'const' or 'let' - replace es5 function declaration by arrow function where applicable
This commit is contained in:

committed by
Tobias Bosch

parent
d22eeb70b8
commit
79e1c7b807
@ -20,16 +20,18 @@ export function main() {
|
|||||||
it('should have angular 1 loaded', () => expect(angular.version.major).toBe(1));
|
it('should have angular 1 loaded', () => expect(angular.version.major).toBe(1));
|
||||||
|
|
||||||
it('should instantiate ng2 in ng1 template and project content', async(() => {
|
it('should instantiate ng2 in ng1 template and project content', async(() => {
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: `{{ 'NG2' }}(<ng-content></ng-content>)`})
|
const Ng2 = Component({
|
||||||
.Class({constructor: function() {}});
|
selector: 'ng2',
|
||||||
|
template: `{{ 'NG2' }}(<ng-content></ng-content>)`
|
||||||
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
var Ng2Module = NgModule({declarations: [Ng2], imports: [BrowserModule]}).Class({
|
const Ng2Module = NgModule({declarations: [Ng2], imports: [BrowserModule]}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var element =
|
const element =
|
||||||
html('<div>{{ \'ng1[\' }}<ng2>~{{ \'ng-content\' }}~</ng2>{{ \']\' }}</div>');
|
html('<div>{{ \'ng1[\' }}<ng2>~{{ \'ng-content\' }}~</ng2>{{ \']\' }}</div>');
|
||||||
|
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(Ng2Module);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(Ng2Module);
|
||||||
@ -42,14 +44,14 @@ export function main() {
|
|||||||
|
|
||||||
it('should instantiate ng1 in ng2 template and project content', async(() => {
|
it('should instantiate ng1 in ng2 template and project content', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var Ng2 = Component({
|
const Ng2 = Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
template: `{{ 'ng2(' }}<ng1>{{'transclude'}}</ng1>{{ ')' }}`,
|
template: `{{ 'ng2(' }}<ng1>{{'transclude'}}</ng1>{{ ')' }}`,
|
||||||
}).Class({constructor: function Ng2() {}});
|
}).Class({constructor: function Ng2() {}});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
@ -60,7 +62,7 @@ export function main() {
|
|||||||
});
|
});
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
|
|
||||||
var element = html('<div>{{\'ng1(\'}}<ng2></ng2>{{\')\'}}</div>');
|
const element = html('<div>{{\'ng1(\'}}<ng2></ng2>{{\')\'}}</div>');
|
||||||
|
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(document.body.textContent).toEqual('ng1(ng2(ng1(transclude)))');
|
expect(document.body.textContent).toEqual('ng1(ng2(ng1(transclude)))');
|
||||||
@ -69,13 +71,13 @@ export function main() {
|
|||||||
}));
|
}));
|
||||||
describe('scope/component change-detection', () => {
|
describe('scope/component change-detection', () => {
|
||||||
it('should interleave scope and component expressions', async(() => {
|
it('should interleave scope and component expressions', async(() => {
|
||||||
var ng1Module = angular.module('ng1', []);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var log: any[] /** TODO #9100 */ = [];
|
const ng1Module = angular.module('ng1', []);
|
||||||
var l = function(value: any /** TODO #9100 */) {
|
const log: any[] /** TODO #9100 */ = [];
|
||||||
|
const l = (value: any /** TODO #9100 */) => {
|
||||||
log.push(value);
|
log.push(value);
|
||||||
return value + ';';
|
return value + ';';
|
||||||
};
|
};
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
|
||||||
|
|
||||||
ng1Module.directive('ng1a', () => ({template: '{{ l(\'ng1a\') }}'}));
|
ng1Module.directive('ng1a', () => ({template: '{{ l(\'ng1a\') }}'}));
|
||||||
ng1Module.directive('ng1b', () => ({template: '{{ l(\'ng1b\') }}'}));
|
ng1Module.directive('ng1b', () => ({template: '{{ l(\'ng1b\') }}'}));
|
||||||
@ -84,12 +86,12 @@ export function main() {
|
|||||||
$rootScope.reset = () => log.length = 0;
|
$rootScope.reset = () => log.length = 0;
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2 = Component({
|
const Ng2 = Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
template: `{{l('2A')}}<ng1a></ng1a>{{l('2B')}}<ng1b></ng1b>{{l('2C')}}`
|
template: `{{l('2A')}}<ng1a></ng1a>{{l('2B')}}<ng1b></ng1b>{{l('2C')}}`
|
||||||
}).Class({constructor: function() { this.l = l; }});
|
}).Class({constructor: function() { this.l = l; }});
|
||||||
|
|
||||||
var Ng2Module =
|
const Ng2Module =
|
||||||
NgModule({
|
NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
adapter.upgradeNg1Component('ng1a'), adapter.upgradeNg1Component('ng1b'), Ng2
|
adapter.upgradeNg1Component('ng1a'), adapter.upgradeNg1Component('ng1b'), Ng2
|
||||||
@ -100,7 +102,7 @@ export function main() {
|
|||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
|
|
||||||
var element =
|
const element =
|
||||||
html('<div>{{reset(); l(\'1A\');}}<ng2>{{l(\'1B\')}}</ng2>{{l(\'1C\')}}</div>');
|
html('<div>{{reset(); l(\'1A\');}}<ng2>{{l(\'1B\')}}</ng2>{{l(\'1C\')}}</div>');
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(document.body.textContent).toEqual('1A;2A;ng1a;2B;ng1b;2C;1C;');
|
expect(document.body.textContent).toEqual('1A;2A;ng1a;2B;ng1b;2C;1C;');
|
||||||
@ -114,7 +116,7 @@ export function main() {
|
|||||||
describe('downgrade ng2 component', () => {
|
describe('downgrade ng2 component', () => {
|
||||||
it('should bind properties, events', async(() => {
|
it('should bind properties, events', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
ng1Module.run(($rootScope: any /** TODO #9100 */) => {
|
ng1Module.run(($rootScope: any /** TODO #9100 */) => {
|
||||||
$rootScope.dataA = 'A';
|
$rootScope.dataA = 'A';
|
||||||
@ -124,7 +126,7 @@ export function main() {
|
|||||||
$rootScope.eventA = '?';
|
$rootScope.eventA = '?';
|
||||||
$rootScope.eventB = '?';
|
$rootScope.eventB = '?';
|
||||||
});
|
});
|
||||||
var Ng2 = Component({
|
const Ng2 = Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
inputs:
|
inputs:
|
||||||
['literal', 'interpolate', 'oneWayA', 'oneWayB', 'twoWayA', 'twoWayB'],
|
['literal', 'interpolate', 'oneWayA', 'oneWayB', 'twoWayA', 'twoWayB'],
|
||||||
@ -152,18 +154,18 @@ export function main() {
|
|||||||
this.twoWayBEmitter = new EventEmitter();
|
this.twoWayBEmitter = new EventEmitter();
|
||||||
},
|
},
|
||||||
ngOnChanges: function(changes: any /** TODO #9100 */) {
|
ngOnChanges: function(changes: any /** TODO #9100 */) {
|
||||||
var assert = (prop: any /** TODO #9100 */, value: any /** TODO #9100 */) => {
|
const assert = (prop: any /** TODO #9100 */, value: any /** TODO #9100 */) => {
|
||||||
if (this[prop] != value) {
|
if (this[prop] != value) {
|
||||||
throw new Error(`Expected: '${prop}' to be '${value}' but was '${this[prop]}'`);
|
throw new Error(`Expected: '${prop}' to be '${value}' but was '${this[prop]}'`);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var assertChange = (prop: any /** TODO #9100 */, value: any /** TODO #9100 */) => {
|
const assertChange = (prop: any /** TODO #9100 */, value: any /** TODO #9100 */) => {
|
||||||
assert(prop, value);
|
assert(prop, value);
|
||||||
if (!changes[prop]) {
|
if (!changes[prop]) {
|
||||||
throw new Error(`Changes record for '${prop}' not found.`);
|
throw new Error(`Changes record for '${prop}' not found.`);
|
||||||
}
|
}
|
||||||
var actValue = changes[prop].currentValue;
|
const actValue = changes[prop].currentValue;
|
||||||
if (actValue != value) {
|
if (actValue != value) {
|
||||||
throw new Error(
|
throw new Error(
|
||||||
`Expected changes record for'${prop}' to be '${value}' but was '${actValue}'`);
|
`Expected changes record for'${prop}' to be '${value}' but was '${actValue}'`);
|
||||||
@ -198,13 +200,13 @@ export function main() {
|
|||||||
});
|
});
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [Ng2],
|
declarations: [Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
var element = html(`<div>
|
const element = html(`<div>
|
||||||
<ng2 literal="Text" interpolate="Hello {{'world'}}"
|
<ng2 literal="Text" interpolate="Hello {{'world'}}"
|
||||||
bind-one-way-a="dataA" [one-way-b]="dataB"
|
bind-one-way-a="dataA" [one-way-b]="dataB"
|
||||||
bindon-two-way-a="modelA" [(two-way-b)]="modelB"
|
bindon-two-way-a="modelA" [(two-way-b)]="modelB"
|
||||||
@ -225,32 +227,32 @@ export function main() {
|
|||||||
|
|
||||||
it('should properly run cleanup when ng1 directive is destroyed', async(() => {
|
it('should properly run cleanup when ng1 directive is destroyed', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
var onDestroyed: EventEmitter<string> = new EventEmitter<string>();
|
const onDestroyed: EventEmitter<string> = new EventEmitter<string>();
|
||||||
|
|
||||||
ng1Module.directive('ng1', () => {
|
ng1Module.directive('ng1', () => {
|
||||||
return {
|
return {
|
||||||
template: '<div ng-if="!destroyIt"><ng2></ng2></div>',
|
template: '<div ng-if="!destroyIt"><ng2></ng2></div>',
|
||||||
controller: function(
|
controller: function(
|
||||||
$rootScope: any /** TODO #9100 */, $timeout: any /** TODO #9100 */) {
|
$rootScope: any /** TODO #9100 */, $timeout: any /** TODO #9100 */) {
|
||||||
$timeout(function() { $rootScope.destroyIt = true; });
|
$timeout(() => { $rootScope.destroyIt = true; });
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: 'test'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: 'test'}).Class({
|
||||||
constructor: function() {},
|
constructor: function() {},
|
||||||
ngOnDestroy: function() { onDestroyed.emit('destroyed'); }
|
ngOnDestroy: function() { onDestroyed.emit('destroyed'); }
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [Ng2],
|
declarations: [Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html('<ng1></ng1>');
|
const element = html('<ng1></ng1>');
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
onDestroyed.subscribe(() => { ref.dispose(); });
|
onDestroyed.subscribe(() => { ref.dispose(); });
|
||||||
});
|
});
|
||||||
@ -259,7 +261,7 @@ export function main() {
|
|||||||
|
|
||||||
it('should fallback to the root ng2.injector when compiled outside the dom', async(() => {
|
it('should fallback to the root ng2.injector when compiled outside the dom', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
ng1Module.directive('ng1', [
|
ng1Module.directive('ng1', [
|
||||||
'$compile',
|
'$compile',
|
||||||
@ -268,25 +270,25 @@ export function main() {
|
|||||||
link: function(
|
link: function(
|
||||||
$scope: any /** TODO #9100 */, $element: any /** TODO #9100 */,
|
$scope: any /** TODO #9100 */, $element: any /** TODO #9100 */,
|
||||||
$attrs: any /** TODO #9100 */) {
|
$attrs: any /** TODO #9100 */) {
|
||||||
var compiled = $compile('<ng2></ng2>');
|
const compiled = $compile('<ng2></ng2>');
|
||||||
var template = compiled($scope);
|
const template = compiled($scope);
|
||||||
$element.append(template);
|
$element.append(template);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
var Ng2 =
|
const Ng2 =
|
||||||
Component({selector: 'ng2', template: 'test'}).Class({constructor: function() {}});
|
Component({selector: 'ng2', template: 'test'}).Class({constructor: function() {}});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [Ng2],
|
declarations: [Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html('<ng1></ng1>');
|
const element = html('<ng1></ng1>');
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('test');
|
expect(multiTrim(document.body.textContent)).toEqual('test');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -401,9 +403,9 @@ export function main() {
|
|||||||
it('should bind properties, events in controller when bindToController is not used',
|
it('should bind properties, events in controller when bindToController is not used',
|
||||||
async(() => {
|
async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
restrict: 'E',
|
restrict: 'E',
|
||||||
template: '{{someText}} - Length: {{data.length}}',
|
template: '{{someText}} - Length: {{data.length}}',
|
||||||
@ -415,7 +417,7 @@ export function main() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
var Ng2 =
|
const Ng2 =
|
||||||
Component({
|
Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
template:
|
template:
|
||||||
@ -428,14 +430,14 @@ export function main() {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
// we need to do setTimeout, because the EventEmitter uses setTimeout to schedule
|
// we need to do setTimeout, because the EventEmitter uses setTimeout to schedule
|
||||||
// events, and so without this we would not see the events processed.
|
// events, and so without this we would not see the events processed.
|
||||||
@ -449,9 +451,9 @@ export function main() {
|
|||||||
|
|
||||||
it('should bind properties, events in link function', async(() => {
|
it('should bind properties, events in link function', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
restrict: 'E',
|
restrict: 'E',
|
||||||
template: '{{someText}} - Length: {{data.length}}',
|
template: '{{someText}} - Length: {{data.length}}',
|
||||||
@ -463,7 +465,7 @@ export function main() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
var Ng2 =
|
const Ng2 =
|
||||||
Component({
|
Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
template:
|
template:
|
||||||
@ -476,14 +478,14 @@ export function main() {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
// we need to do setTimeout, because the EventEmitter uses setTimeout to schedule
|
// we need to do setTimeout, because the EventEmitter uses setTimeout to schedule
|
||||||
// events, and so without this we would not see the events processed.
|
// events, and so without this we would not see the events processed.
|
||||||
@ -497,26 +499,26 @@ export function main() {
|
|||||||
|
|
||||||
it('should support templateUrl fetched from $httpBackend', async(() => {
|
it('should support templateUrl fetched from $httpBackend', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
ng1Module.value(
|
ng1Module.value(
|
||||||
'$httpBackend', (method: any /** TODO #9100 */, url: any /** TODO #9100 */,
|
'$httpBackend', (method: any /** TODO #9100 */, url: any /** TODO #9100 */,
|
||||||
post: any /** TODO #9100 */,
|
post: any /** TODO #9100 */,
|
||||||
cbFn: any /** TODO #9100 */) => { cbFn(200, `${method}:${url}`); });
|
cbFn: any /** TODO #9100 */) => { cbFn(200, `${method}:${url}`); });
|
||||||
|
|
||||||
var ng1 = function() { return {templateUrl: 'url.html'}; };
|
const ng1 = () => { return {templateUrl: 'url.html'}; };
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('GET:url.html');
|
expect(multiTrim(document.body.textContent)).toEqual('GET:url.html');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -525,27 +527,26 @@ export function main() {
|
|||||||
|
|
||||||
it('should support templateUrl as a function', async(() => {
|
it('should support templateUrl as a function', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
ng1Module.value(
|
ng1Module.value(
|
||||||
'$httpBackend', (method: any /** TODO #9100 */, url: any /** TODO #9100 */,
|
'$httpBackend', (method: any /** TODO #9100 */, url: any /** TODO #9100 */,
|
||||||
post: any /** TODO #9100 */,
|
post: any /** TODO #9100 */,
|
||||||
cbFn: any /** TODO #9100 */) => { cbFn(200, `${method}:${url}`); });
|
cbFn: any /** TODO #9100 */) => { cbFn(200, `${method}:${url}`); });
|
||||||
|
|
||||||
var ng1 = function() { return {templateUrl() { return 'url.html'; }}; };
|
const ng1 = () => { return {templateUrl() { return 'url.html'; }}; };
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('GET:url.html');
|
expect(multiTrim(document.body.textContent)).toEqual('GET:url.html');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -554,23 +555,23 @@ export function main() {
|
|||||||
|
|
||||||
it('should support empty template', async(() => {
|
it('should support empty template', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() { return {template: ''}; };
|
const ng1 = () => { return {template: ''}; };
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('');
|
expect(multiTrim(document.body.textContent)).toEqual('');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -579,23 +580,23 @@ export function main() {
|
|||||||
|
|
||||||
it('should support template as a function', async(() => {
|
it('should support template as a function', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() { return {template() { return ''; }}; };
|
const ng1 = () => { return {template() { return ''; }}; };
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('');
|
expect(multiTrim(document.body.textContent)).toEqual('');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -604,25 +605,25 @@ export function main() {
|
|||||||
|
|
||||||
it('should support templateUrl fetched from $templateCache', async(() => {
|
it('should support templateUrl fetched from $templateCache', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
ng1Module.run(
|
ng1Module.run(
|
||||||
($templateCache: any /** TODO #9100 */) => $templateCache.put('url.html', 'WORKS'));
|
($templateCache: any /** TODO #9100 */) => $templateCache.put('url.html', 'WORKS'));
|
||||||
|
|
||||||
var ng1 = function() { return {templateUrl: 'url.html'}; };
|
const ng1 = () => { return {templateUrl: 'url.html'}; };
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -631,9 +632,9 @@ export function main() {
|
|||||||
|
|
||||||
it('should support controller with controllerAs', async(() => {
|
it('should support controller with controllerAs', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
scope: true,
|
scope: true,
|
||||||
template:
|
template:
|
||||||
@ -656,18 +657,18 @@ export function main() {
|
|||||||
};
|
};
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('scope; isClass; NG1; published');
|
expect(multiTrim(document.body.textContent)).toEqual('scope; isClass; NG1; published');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -676,9 +677,9 @@ export function main() {
|
|||||||
|
|
||||||
it('should support bindToController', async(() => {
|
it('should support bindToController', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
scope: {title: '@'},
|
scope: {title: '@'},
|
||||||
bindToController: true,
|
bindToController: true,
|
||||||
@ -689,18 +690,18 @@ export function main() {
|
|||||||
};
|
};
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1 title="WORKS"></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1 title="WORKS"></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -709,9 +710,9 @@ export function main() {
|
|||||||
|
|
||||||
it('should support bindToController with bindings', async(() => {
|
it('should support bindToController with bindings', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
scope: {},
|
scope: {},
|
||||||
bindToController: {title: '@'},
|
bindToController: {title: '@'},
|
||||||
@ -722,18 +723,18 @@ export function main() {
|
|||||||
};
|
};
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1 title="WORKS"></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1 title="WORKS"></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -742,9 +743,9 @@ export function main() {
|
|||||||
|
|
||||||
it('should support single require in linking fn', async(() => {
|
it('should support single require in linking fn', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = function($rootScope: any /** TODO #9100 */) {
|
const ng1 = ($rootScope: any /** TODO #9100 */) => {
|
||||||
return {
|
return {
|
||||||
scope: {title: '@'},
|
scope: {title: '@'},
|
||||||
bindToController: true,
|
bindToController: true,
|
||||||
@ -764,18 +765,18 @@ export function main() {
|
|||||||
};
|
};
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
expect(multiTrim(document.body.textContent)).toEqual('WORKS');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -784,12 +785,12 @@ export function main() {
|
|||||||
|
|
||||||
it('should support array require in linking fn', async(() => {
|
it('should support array require in linking fn', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var parent = function() {
|
const parent = () => {
|
||||||
return {controller: Class({constructor: function() { this.parent = 'PARENT'; }})};
|
return {controller: Class({constructor: function() { this.parent = 'PARENT'; }})};
|
||||||
};
|
};
|
||||||
var ng1 = function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
scope: {title: '@'},
|
scope: {title: '@'},
|
||||||
bindToController: true,
|
bindToController: true,
|
||||||
@ -811,18 +812,18 @@ export function main() {
|
|||||||
ng1Module.directive('parent', parent);
|
ng1Module.directive('parent', parent);
|
||||||
ng1Module.directive('ng1', ng1);
|
ng1Module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
var element = html(`<div><parent><ng2></ng2></parent></div>`);
|
const element = html(`<div><parent><ng2></ng2></parent></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('PARENT:WORKS');
|
expect(multiTrim(document.body.textContent)).toEqual('PARENT:WORKS');
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -831,10 +832,10 @@ export function main() {
|
|||||||
|
|
||||||
it('should call $onInit of components', async(() => {
|
it('should call $onInit of components', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
var valueToFind = '$onInit';
|
const valueToFind = '$onInit';
|
||||||
|
|
||||||
var ng1 = {
|
const ng1 = {
|
||||||
bindings: {},
|
bindings: {},
|
||||||
template: '{{$ctrl.value}}',
|
template: '{{$ctrl.value}}',
|
||||||
controller: Class(
|
controller: Class(
|
||||||
@ -842,11 +843,11 @@ export function main() {
|
|||||||
};
|
};
|
||||||
ng1Module.component('ng1', ng1);
|
ng1Module.component('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
@ -854,7 +855,7 @@ export function main() {
|
|||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
|
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
|
expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -863,21 +864,21 @@ export function main() {
|
|||||||
|
|
||||||
it('should bind input properties (<) of components', async(() => {
|
it('should bind input properties (<) of components', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = {
|
const ng1 = {
|
||||||
bindings: {personProfile: '<'},
|
bindings: {personProfile: '<'},
|
||||||
template: 'Hello {{$ctrl.personProfile.firstName}} {{$ctrl.personProfile.lastName}}',
|
template: 'Hello {{$ctrl.personProfile.firstName}} {{$ctrl.personProfile.lastName}}',
|
||||||
controller: Class({constructor: function() {}})
|
controller: Class({constructor: function() {}})
|
||||||
};
|
};
|
||||||
ng1Module.component('ng1', ng1);
|
ng1Module.component('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 =
|
const Ng2 =
|
||||||
Component({selector: 'ng2', template: '<ng1 [personProfile]="goku"></ng1>'}).Class({
|
Component({selector: 'ng2', template: '<ng1 [personProfile]="goku"></ng1>'}).Class({
|
||||||
constructor: function() { this.goku = {firstName: 'GOKU', lastName: 'SAN'}; }
|
constructor: function() { this.goku = {firstName: 'GOKU', lastName: 'SAN'}; }
|
||||||
});
|
});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
@ -885,7 +886,7 @@ export function main() {
|
|||||||
|
|
||||||
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
|
||||||
|
|
||||||
var element = html(`<div><ng2></ng2></div>`);
|
const element = html(`<div><ng2></ng2></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual(`Hello GOKU SAN`);
|
expect(multiTrim(document.body.textContent)).toEqual(`Hello GOKU SAN`);
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
@ -894,29 +895,29 @@ export function main() {
|
|||||||
|
|
||||||
it('should support ng2 > ng1 > ng2', async(() => {
|
it('should support ng2 > ng1 > ng2', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var ng1Module = angular.module('ng1', []);
|
const ng1Module = angular.module('ng1', []);
|
||||||
|
|
||||||
var ng1 = {
|
const ng1 = {
|
||||||
template: 'ng1(<ng2b></ng2b>)',
|
template: 'ng1(<ng2b></ng2b>)',
|
||||||
};
|
};
|
||||||
ng1Module.component('ng1', ng1);
|
ng1Module.component('ng1', ng1);
|
||||||
|
|
||||||
var Ng2a = Component({selector: 'ng2a', template: 'ng2a(<ng1></ng1>)'}).Class({
|
const Ng2a = Component({selector: 'ng2a', template: 'ng2a(<ng1></ng1>)'}).Class({
|
||||||
constructor: function() {}
|
constructor: function() {}
|
||||||
});
|
});
|
||||||
ng1Module.directive('ng2a', adapter.downgradeNg2Component(Ng2a));
|
ng1Module.directive('ng2a', adapter.downgradeNg2Component(Ng2a));
|
||||||
|
|
||||||
var Ng2b =
|
const Ng2b =
|
||||||
Component({selector: 'ng2b', template: 'ng2b'}).Class({constructor: function() {}});
|
Component({selector: 'ng2b', template: 'ng2b'}).Class({constructor: function() {}});
|
||||||
ng1Module.directive('ng2b', adapter.downgradeNg2Component(Ng2b));
|
ng1Module.directive('ng2b', adapter.downgradeNg2Component(Ng2b));
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2a, Ng2b],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2a, Ng2b],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
var element = html(`<div><ng2a></ng2a></div>`);
|
const element = html(`<div><ng2a></ng2a></div>`);
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
expect(multiTrim(document.body.textContent)).toEqual('ng2a(ng1(ng2b))');
|
expect(multiTrim(document.body.textContent)).toEqual('ng2a(ng1(ng2b))');
|
||||||
});
|
});
|
||||||
@ -927,14 +928,14 @@ export function main() {
|
|||||||
function SomeToken() {}
|
function SomeToken() {}
|
||||||
|
|
||||||
it('should export ng2 instance to ng1', async(() => {
|
it('should export ng2 instance to ng1', async(() => {
|
||||||
var MyNg2Module = NgModule({
|
const MyNg2Module = NgModule({
|
||||||
providers: [{provide: SomeToken, useValue: 'correct_value'}],
|
providers: [{provide: SomeToken, useValue: 'correct_value'}],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
||||||
var module = angular.module('myExample', []);
|
const module = angular.module('myExample', []);
|
||||||
module.factory('someToken', adapter.downgradeNg2Provider(SomeToken));
|
module.factory('someToken', adapter.downgradeNg2Provider(SomeToken));
|
||||||
adapter.bootstrap(html('<div>'), ['myExample']).ready((ref) => {
|
adapter.bootstrap(html('<div>'), ['myExample']).ready((ref) => {
|
||||||
expect(ref.ng1Injector.get('someToken')).toBe('correct_value');
|
expect(ref.ng1Injector.get('someToken')).toBe('correct_value');
|
||||||
@ -943,11 +944,11 @@ export function main() {
|
|||||||
}));
|
}));
|
||||||
|
|
||||||
it('should export ng1 instance to ng2', async(() => {
|
it('should export ng1 instance to ng2', async(() => {
|
||||||
var MyNg2Module =
|
const MyNg2Module =
|
||||||
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
||||||
|
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
||||||
var module = angular.module('myExample', []);
|
const module = angular.module('myExample', []);
|
||||||
module.value('testValue', 'secreteToken');
|
module.value('testValue', 'secreteToken');
|
||||||
adapter.upgradeNg1Provider('testValue');
|
adapter.upgradeNg1Provider('testValue');
|
||||||
adapter.upgradeNg1Provider('testValue', {asToken: 'testToken'});
|
adapter.upgradeNg1Provider('testValue', {asToken: 'testToken'});
|
||||||
@ -963,14 +964,14 @@ export function main() {
|
|||||||
|
|
||||||
describe('testability', () => {
|
describe('testability', () => {
|
||||||
it('should handle deferred bootstrap', async(() => {
|
it('should handle deferred bootstrap', async(() => {
|
||||||
var MyNg2Module =
|
const MyNg2Module =
|
||||||
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
||||||
|
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
||||||
angular.module('ng1', []);
|
angular.module('ng1', []);
|
||||||
var bootstrapResumed: boolean = false;
|
let bootstrapResumed: boolean = false;
|
||||||
|
|
||||||
var element = html('<div></div>');
|
const element = html('<div></div>');
|
||||||
window.name = 'NG_DEFER_BOOTSTRAP!' + window.name;
|
window.name = 'NG_DEFER_BOOTSTRAP!' + window.name;
|
||||||
|
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
@ -985,18 +986,18 @@ export function main() {
|
|||||||
}));
|
}));
|
||||||
|
|
||||||
it('should wait for ng2 testability', async(() => {
|
it('should wait for ng2 testability', async(() => {
|
||||||
var MyNg2Module =
|
const MyNg2Module =
|
||||||
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
NgModule({imports: [BrowserModule]}).Class({constructor: function() {}});
|
||||||
|
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
|
||||||
angular.module('ng1', []);
|
angular.module('ng1', []);
|
||||||
var element = html('<div></div>');
|
const element = html('<div></div>');
|
||||||
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
adapter.bootstrap(element, ['ng1']).ready((ref) => {
|
||||||
var ng2Testability: Testability = ref.ng2Injector.get(Testability);
|
const ng2Testability: Testability = ref.ng2Injector.get(Testability);
|
||||||
ng2Testability.increasePendingRequestCount();
|
ng2Testability.increasePendingRequestCount();
|
||||||
var ng2Stable = false;
|
let ng2Stable = false;
|
||||||
|
|
||||||
angular.getTestability(element).whenStable(function() {
|
angular.getTestability(element).whenStable(() => {
|
||||||
expect(ng2Stable).toEqual(true);
|
expect(ng2Stable).toEqual(true);
|
||||||
ref.dispose();
|
ref.dispose();
|
||||||
});
|
});
|
||||||
@ -1011,7 +1012,7 @@ export function main() {
|
|||||||
|
|
||||||
it('should allow attribute selectors for components in ng2', async(() => {
|
it('should allow attribute selectors for components in ng2', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => MyNg2Module));
|
||||||
var ng1Module = angular.module('myExample', []);
|
const ng1Module = angular.module('myExample', []);
|
||||||
|
|
||||||
@Component({selector: '[works]', template: 'works!'})
|
@Component({selector: '[works]', template: 'works!'})
|
||||||
class WorksComponent {
|
class WorksComponent {
|
||||||
@ -1037,24 +1038,25 @@ export function main() {
|
|||||||
describe('examples', () => {
|
describe('examples', () => {
|
||||||
it('should verify UpgradeAdapter example', async(() => {
|
it('should verify UpgradeAdapter example', async(() => {
|
||||||
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
|
||||||
var module = angular.module('myExample', []);
|
const module = angular.module('myExample', []);
|
||||||
|
|
||||||
module.directive('ng1', function() {
|
const ng1 = () => {
|
||||||
return {
|
return {
|
||||||
scope: {title: '='},
|
scope: {title: '='},
|
||||||
transclude: true,
|
transclude: true,
|
||||||
template: 'ng1[Hello {{title}}!](<span ng-transclude></span>)'
|
template: 'ng1[Hello {{title}}!](<span ng-transclude></span>)'
|
||||||
};
|
};
|
||||||
});
|
};
|
||||||
|
module.directive('ng1', ng1);
|
||||||
|
|
||||||
var Ng2 =
|
const Ng2 =
|
||||||
Component({
|
Component({
|
||||||
selector: 'ng2',
|
selector: 'ng2',
|
||||||
inputs: ['name'],
|
inputs: ['name'],
|
||||||
template: 'ng2[<ng1 [title]="name">transclude</ng1>](<ng-content></ng-content>)'
|
template: 'ng2[<ng1 [title]="name">transclude</ng1>](<ng-content></ng-content>)'
|
||||||
}).Class({constructor: function() {}});
|
}).Class({constructor: function() {}});
|
||||||
|
|
||||||
var Ng2Module = NgModule({
|
const Ng2Module = NgModule({
|
||||||
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
|
||||||
imports: [BrowserModule],
|
imports: [BrowserModule],
|
||||||
schemas: [NO_ERRORS_SCHEMA],
|
schemas: [NO_ERRORS_SCHEMA],
|
||||||
@ -1079,7 +1081,7 @@ function multiTrim(text: string): string {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function html(html: string): Element {
|
function html(html: string): Element {
|
||||||
var body = document.body;
|
const body = document.body;
|
||||||
body.innerHTML = html;
|
body.innerHTML = html;
|
||||||
if (body.childNodes.length == 1 && body.firstChild instanceof HTMLElement)
|
if (body.childNodes.length == 1 && body.firstChild instanceof HTMLElement)
|
||||||
return <Element>body.firstChild;
|
return <Element>body.firstChild;
|
||||||
|
Reference in New Issue
Block a user