chore(tests): fix failing core e2e and angular test app (#21986)

- version updates, add package-lock to the angular test-app
- add protractor ci config
- install headless chrome dependencies per https://github.com/puppeteer/puppeteer/blob/main/docs/troubleshooting.md#running-puppeteer-on-circleci

angular/test/test-app/e2e/protractor-ci.conf.js

@@ -0,0 +1,14 @@
+
+// Protractor CI configuration file, see link for more information
+// https://angular.io/guide/testing#configure-cli-for-ci-testing-in-chrome
+
+const config = require('./protractor.conf').config;
+
+config.capabilities = {
+  browserName: 'chrome',
+  chromeOptions: {
+    args: ['--headless', '--no-sandbox', '--window-size=1920,1080']
+  }
+};
+
+exports.config = config;

angular/test/test-app/e2e/protractor.conf.js

@@ -1,4 +1,4 @@
-  // @ts-check
+// @ts-check
 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 

angular/test/test-app/e2e/src/form.e2e-spec.ts

@@ -31,13 +31,13 @@ describe('form', () => {
       await testStatus('INVALID');
       expect(await getText('#submit')).toEqual('false');
       await testData({
-        'datetime': '2010-08-20',
-        'select': null,
-        'toggle': false,
-        'input': '',
-        'input2': 'Default Value',
-        'checkbox': false,
-        'range': 5
+        datetime: '2010-08-20',
+        select: null,
+        toggle: false,
+        input: '',
+        input2: 'Default Value',
+        checkbox: false,
+        range: 5
       });
     });
 
@@ -49,39 +49,39 @@ describe('form', () => {
       await setProperty('ion-range', 'value', 40);
       await testStatus('VALID');
       await testData({
-        'datetime': '2010-08-20',
-        'select': 'nes',
-        'toggle': false,
-        'input': 'Some value',
-        'input2': 'Default Value',
-        'checkbox': false,
-        'range': 40
+        datetime: '2010-08-20',
+        select: 'nes',
+        toggle: false,
+        input: 'Some value',
+        input2: 'Default Value',
+        checkbox: false,
+        range: 40
       });
     });
 
     it('ion-toggle should change', async () => {
       await element(by.css('form ion-toggle')).click();
       await testData({
-        'datetime': '2010-08-20',
-        'select': null,
-        'toggle': true,
-        'input': '',
-        'input2': 'Default Value',
-        'checkbox': false,
-        'range': 5
+        datetime: '2010-08-20',
+        select: null,
+        toggle: true,
+        input: '',
+        input2: 'Default Value',
+        checkbox: false,
+        range: 5
       });
     });
 
     it('ion-checkbox should change', async () => {
       await element(by.css('ion-checkbox')).click();
       await testData({
-        'datetime': '2010-08-20',
-        'select': null,
-        'toggle': false,
-        'input': '',
-        'input2': 'Default Value',
-        'checkbox': true,
-        'range': 5
+        datetime: '2010-08-20',
+        select: null,
+        toggle: false,
+        input: '',
+        input2: 'Default Value',
+        checkbox: true,
+        range: 5
       });
     });
 
@@ -102,23 +102,23 @@ describe('form', () => {
     it('ion-toggle should change only after blur', async () => {
       await element(by.css('form ion-toggle')).click();
       await testData({
-        'datetime': '2010-08-20',
-        'select': null,
-        'toggle': false,
-        'input': '',
-        'input2': 'Default Value',
-        'checkbox': false,
-        'range': 5
+        datetime: '2010-08-20',
+        select: null,
+        toggle: false,
+        input: '',
+        input2: 'Default Value',
+        checkbox: false,
+        range: 5
       });
       await element(by.css('ion-checkbox')).click();
       await testData({
-        'datetime': '2010-08-20',
-        'select': null,
-        'toggle': true,
-        'input': '',
-        'input2': 'Default Value',
-        'checkbox': false,
-        'range': 5
+        datetime: '2010-08-20',
+        select: null,
+        toggle: true,
+        input: '',
+        input2: 'Default Value',
+        checkbox: false,
+        range: 5
       });
     });
   });

angular/test/test-app/e2e/src/tabs.e2e-spec.ts

@@ -149,7 +149,7 @@ describe('tabs', () => {
 
     it('should set root when clicking on an active tab to navigate to the root', async () => {
       const expectNestedTabUrlToContain = 'search=hello#fragment';
-      let tab = await getSelectedTab() as ElementFinder;
+      const tab = await getSelectedTab() as ElementFinder;
       const initialUrl = await browser.getCurrentUrl();
       await tab.$('#goto-nested-page1-with-query-params').click();
       await testTabTitle('Tab 1 - Page 2 (1)');
@@ -176,7 +176,7 @@ describe('tabs', () => {
     it('should preserve root url navigation extras when clicking on an active tab to navigate to the root', async () => {
       await browser.get(rootUrl);
 
-      let tab = await getSelectedTab() as ElementFinder;
+      const tab = await getSelectedTab() as ElementFinder;
       await tab.$('#goto-nested-page1-with-query-params').click();
       await testTabTitle('Tab 1 - Page 2 (1)');
       await testUrlContains(expectNestedTabUrlToContain);

angular/test/test-app/e2e/src/utils.ts

@@ -37,7 +37,7 @@ export interface LifeCycleCount {
 }
 
 export function handleErrorMessages() {
-  return browser.manage().logs().get('browser').then(function (browserLog) {
+  return browser.manage().logs().get('browser').then(browserLog => {
     for (let i = 0; i <= browserLog.length - 1; i++) {
       if (browserLog[i].level.name_ === 'SEVERE') {
         fail(browserLog[i].message);