feat(upgrade): allow non-element selectors for downgraded components (#14037)

This affects the dynamic version of `upgrade` and makes it more consistent with
the static version, while removing an artificial limitation.

This commit also refactors the file layout and code, in order to share code wrt
to dowgrading components between the dynamic and static versions.

modules/@angular/upgrade/test/dynamic/metadata_spec.ts

@@ -7,23 +7,17 @@
  */
 
 import {Component} from '@angular/core';
-import {describe, expect, it} from '@angular/core/testing/testing_internal';
 import {getComponentInfo, parseFields} from '@angular/upgrade/src/dynamic/metadata';
 
 export function main() {
   describe('upgrade metadata', () => {
     it('should extract component selector', () => {
-      expect(getComponentInfo(ElementNameComponent).selector).toEqual('elementNameDashed');
+      expect(getComponentInfo(ElementNameComponent).selector).toBe('element-name-dashed');
     });
 
 
     describe('errors', () => {
       it('should throw on missing selector', () => {
-        expect(() => getComponentInfo(AttributeNameComponent))
-            .toThrowError('Only selectors matching element names are supported, got: [attr-name]');
-      });
-
-      it('should throw on non element names', () => {
         expect(() => getComponentInfo(NoAnnotationComponent))
             .toThrowError('No Directive annotation found on NoAnnotationComponent');
       });
@@ -34,7 +28,7 @@ export function main() {
 
       it('should process values', () => {
         expect(parseFields([' name ', ' prop :  attr '])).toEqual([
-          {
+          jasmine.objectContaining({
             prop: 'name',
             attr: 'name',
             bracketAttr: '[name]',
@@ -43,8 +37,8 @@ export function main() {
             onAttr: 'onName',
             bindAttr: 'bindName',
             bindonAttr: 'bindonName'
-          },
-          {
+          }),
+          jasmine.objectContaining({
             prop: 'prop',
             attr: 'attr',
             bracketAttr: '[attr]',
@@ -53,7 +47,7 @@ export function main() {
             onAttr: 'onAttr',
             bindAttr: 'bindAttr',
             bindonAttr: 'bindonAttr'
-          }
+          })
         ]);
       });
     });

modules/@angular/upgrade/test/dynamic/upgrade_spec.ts

@@ -271,6 +271,25 @@ export function main() {
     });
 
     describe('downgrade ng2 component', () => {
+      it('should allow non-element selectors for downgraded components', async(() => {
+           @Component({selector: '[itWorks]', template: 'It works'})
+           class WorksComponent {
+           }
+
+           @NgModule({declarations: [WorksComponent], imports: [BrowserModule]})
+           class Ng2Module {
+           }
+
+           const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
+           const ng1Module = angular.module('ng1', []);
+           ng1Module.directive('ng2', adapter.downgradeNg2Component(WorksComponent));
+
+           const element = html('<ng2></ng2>');
+           adapter.bootstrap(element, ['ng1']).ready((ref) => {
+             expect(multiTrim(document.body.textContent)).toBe('It works');
+           });
+         }));
+
       it('should bind properties, events', async(() => {
            const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
            const ng1Module = angular.module('ng1', []);
@@ -458,7 +477,6 @@ export function main() {
            });
          }));
 
-
       it('should fallback to the root ng2.injector when compiled outside the dom', async(() => {
            const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
            const ng1Module = angular.module('ng1', []);