build: re-enable upgrade playground example (#28490)

The `upgrade` playground example has been disabled for a
long time because Protractor initially didn't support running
hybrid apps. Now that we use a more recent version of Protractor
that handles hybrid apps (also automatically), we can re-enable
this long-standing disabled test.

Additionally the e2e test logic was outdated and failed because a
CSS selector did not match the template of the upgrade example.
With this change, the CSS selector has been updated to match the
example's template, and also the test has been updated slightly
to also ensure that content projection works.

PR Close #28490

modules/playground/e2e_test/upgrade/upgrade_spec.ts

@@ -6,23 +6,20 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {verifyNoBrowserErrors} from 'e2e_util/e2e_util';
 import {browser, by, element} from 'protractor';
 
-// TODO(i): re-enable once we are using a version of protractor containing the
+import {verifyNoBrowserErrors} from '../../../e2e_util/e2e_util';
-// change in https://github.com/angular/protractor/pull/3403
+
-xdescribe('ngUpgrade', function() {
+describe('ngUpgrade', function() {
-  const URL = 'all/playground/src/upgrade/index.html';
+  const URL = '/';
 
   beforeEach(function() {
     browser.rootEl = 'body';
-    (<any>browser).ng12Hybrid = true;
     browser.get(URL);
   });
 
   afterEach(function() {
-    (<any>browser).useAllAngular2AppRoots();
+    browser.useAllAngular2AppRoots();
-    (<any>browser).ng12Hybrid = false;
     verifyNoBrowserErrors();
   });
 
@@ -30,7 +27,10 @@ xdescribe('ngUpgrade', function() {
     const ng1NameInput = element(by.css('input[ng-model="name"]'));
     expect(ng1NameInput.getAttribute('value')).toEqual('World');
 
-    const userSpan = element(by.css('user span'));
+    const projectedGreetingEl = element(by.css('.projected-content .greeting'));
-    expect(userSpan.getText()).toMatch(/World$/);
+    const upgradedNg1ComponentEl = element(by.css('ng1-user'));
+
+    expect(projectedGreetingEl.getText()).toMatch(/World!$/);
+    expect(upgradedNg1ComponentEl.getText()).toMatch(/^User: World/);
   });
 });

modules/playground/src/upgrade/index.ts

@@ -61,7 +61,7 @@ export class Pane {
       <pane title="Title: {{user}}">
         <table cellpadding="3">
           <tr>
-            <td><ng-content></ng-content></td>
+            <td class="projected-content"><ng-content></ng-content></td>
             <td><ng1-user [handle]="user" (reset)="reset.emit()"></ng1-user></td>
           </tr>
         </table>