4.3.1 (#18150)

* fix(angular): support replaceUrl with angular <7.2

* run linter

.circleci/config.yml

@@ -60,7 +60,7 @@ jobs:
           working_directory: /tmp/workspace/core
       - save_cache: *save-cache-core
       - run:
-          command: npm run build -- --ci
+          command: npm run build -- --max-workers 1
           working_directory: /tmp/workspace/core
       - save_cache: *save-cache-core-stencil
       - persist_to_workspace:
@@ -91,75 +91,6 @@ jobs:
           paths:
             - "*"
 
-  build-angular-server:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: npm install
-          working_directory: /tmp/workspace/packages/angular-server
-      - run:
-          command: npm run build.prod
-          working_directory: /tmp/workspace/packages/angular-server
-      - persist_to_workspace:
-          root: /tmp/workspace
-          paths:
-            - "*"
-
-  build-react:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: npm install
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/core
-      - run:
-          command: sudo npm link @ionic/core
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: npm run build
-          working_directory: /tmp/workspace/packages/react
-      - persist_to_workspace:
-          root: /tmp/workspace
-          paths:
-            - "*"
-
-  build-react-router:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: npm install
-          working_directory: /tmp/workspace/packages/react-router
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/core
-      - run:
-          command: sudo npm link @ionic/core
-          working_directory: /tmp/workspace/packages/react-router
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: sudo npm link @ionic/react
-          working_directory: /tmp/workspace/packages/react-router
-      - run:
-          command: npm run build
-          working_directory: /tmp/workspace/packages/react-router
-      - persist_to_workspace:
-          root: /tmp/workspace
-          paths:
-            - "*"
-
   test-core-clean-build:
     <<: *defaults
     steps:
@@ -188,7 +119,7 @@ jobs:
       - attach_workspace:
           at: /tmp/workspace
       - run:
-          command: npm run test.spec --ci
+          command: npm run test.spec
           working_directory: /tmp/workspace/core
 
   test-core-treeshake:
@@ -198,7 +129,7 @@ jobs:
       - attach_workspace:
           at: /tmp/workspace
       - run:
-          command: npm run test.treeshake --ci
+          command: npm run test.treeshake
           working_directory: /tmp/workspace/core
 
   test-core-screenshot:
@@ -233,64 +164,6 @@ jobs:
           command: npm run lint
           working_directory: /tmp/workspace/angular
 
-  test-react-lint:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: npm run lint
-          working_directory: /tmp/workspace/packages/react
-
-  test-react-router-lint:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: npm run lint
-          working_directory: /tmp/workspace/packages/react-router
-
-  test-react-spec:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/core
-      - run:
-          command: sudo npm link @ionic/core
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: npm run test.spec
-          working_directory: /tmp/workspace/packages/react
-
-  test-react-router-spec:
-    <<: *defaults
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp/workspace
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/core
-      - run:
-          command: sudo npm link @ionic/core
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: sudo npm link
-          working_directory: /tmp/workspace/packages/react
-      - run:
-          command: sudo npm link @ionic/react
-          working_directory: /tmp/workspace/packages/react-router
-      - run:
-          command: npm run test.spec
-          working_directory: /tmp/workspace/packages/react-router
-
   test-angular-e2e:
     <<: *defaults
     steps:
@@ -300,9 +173,6 @@ jobs:
       - run:
           command: npm install
           working_directory: /tmp/workspace/angular/test/test-app
-      - run:
-          command: npm run sync
-          working_directory: /tmp/workspace/angular/test/test-app
       - run:
           command: npm test
           working_directory: /tmp/workspace/angular/test/test-app
@@ -335,23 +205,7 @@ workflows:
 
       - build-angular:
           requires: [build-core]
-      - build-angular-server:
-          requires: [build-angular]
-      - build-react:
-          requires: [build-core]
-      - build-react-router:
-          requires: [build-core, build-react]
-      - test-react-lint:
-          requires: [build-react]
-      - test-react-router-lint:
-          requires: [build-react-router]
-      - test-react-spec:
-          requires: [build-react]
-      - test-react-router-spec:
-          requires: [build-react-router]
       - test-angular-lint:
           requires: [build-angular]
       - test-angular-e2e:
-          requires:
-            - build-angular
-            - build-angular-server
+          requires: [build-angular]

.github/ISSUE_TEMPLATE/bug_report.md

@@ -37,7 +37,6 @@ assignees: ''
 A sample application via GitHub
 
 StackBlitz (https://stackblitz.com)
-Ionic Angular StackBlitz: https://stackblitz.com/edit/ionic-v4-angular-tabs
 
 Plunker (http://plnkr.co/edit/cpeRJs?p=preview)
 

.github/PROCESS.md

@@ -64,7 +64,7 @@ If the issue is a support question, the submitter should be redirected to our [f
 
 ### Incomplete Template
 
-If the issue template has not been filled out completely, the issue should be closed and locked. The submitter should be informed to re-submit the issue making sure they fill the form out completely. Use the `ionitron: missing template` label to accomplish this.
+If the issue template has not been filled out completely, the issue should be closed and locked. The submitter should be informed top re-submit the issue making sure they fill the form out completely. Use the `ionitron: missing template` label to accomplish this.
 
 ### Issues with Open Questions
 
@@ -77,7 +77,7 @@ NOTE: be sure to perform those actions in the order stated. If you add the comme
 
 If there is a response to the question, the bot will remove the `needs: reply` and apply the `triage` label. The issue will then go through the triage handling again.
 
-If there is no response within 30 days, the issue will be closed and locked.
+if there is no response within 30 days, the issue will be closed and locked.
 
 ## Workflow
 
@@ -221,11 +221,9 @@ Hotfixes bypass `master` and should only be used for urgent fixes that can't wai
 
 ## Releasing
 
-1. Create the release branch from `master`, for example: `release-4.5.0`.
+1. Create the release branch from `master`, for example: `release-4.1.0`.
 
-1. For major or minor releases, create a version branch based off the latest version branch. For example, if releasing 4.5.0, create a branch called `4.5.x` based off `4.4.x`.
-
-1. Submit a pull request from the release branch into the version branch. Do not merge this pull request yet.
+1. Submit a pull request from the release branch into `stable`. Do not merge this pull request yet.
 
 1. Verify all tests are passing, fix any bugs if needed and make sure no undesired commits are in.
 
@@ -237,8 +235,7 @@ Hotfixes bypass `master` and should only be used for urgent fixes that can't wai
     - Select the version based on the type of commits and the [Ionic Versioning](https://ionicframework.com/docs/intro/versioning)
     - After the process completes, verify the version number in all packages (`core`, `docs`, `angular`)
     - Verify the changelog commits are accurate and follow the [proper format]((https://github.com/ionic-team/ionic/blob/master/.github/CONTRIBUTING.md#commit-message-format))
-    - For major or minor releases, ensure that the version number has an associated title (for example: `4.5.0 Boron`)
-    - Commit these changes with the version number as the message, e.g. `git commit -m "4.5.0"`
+    - Commit these changes with the version number as the message, e.g. `git commit -m "4.1.0"`
 
 1. Run `npm run release`
 
@@ -246,6 +243,8 @@ Hotfixes bypass `master` and should only be used for urgent fixes that can't wai
 
     <img width="191" alt="Merge pull request button" src="https://user-images.githubusercontent.com/236501/47032669-8be1b980-d138-11e8-9a90-d1518c223184.png">
 
-1. Rewrite the commit message to `merge release-[VERSION]` with the proper release branch. For example, if this release is for `4.5.0`, the message would be `merge release-4.5.0`.
+1. Rewrite the commit message to `merge release-4.1.0` with the proper release branch.
 
-1. Submit a pull request from the release branch into `master`. Merge this pull request using the same commit format in the last step, to ensure any changes made on the release branch get added to future releases.
+1. Create a pull request and merge the release branch back into `master` using the same commit format in the last step, to ensure any changes made on the release branch get added to future releases.
+
+1. Merge the release branch into its corresponding version branch. If this is a major or minor release, create the version branch off the latest `stable`.

.gitignore

@@ -15,7 +15,6 @@ log.txt
 coverage/
 collection/
 dist/
-dist-transpiled/
 node_modules/
 tmp/
 temp/
@@ -50,17 +49,10 @@ demos/src/**/*.ngfactory.ts
 demos/src/**/*.d.ts
 demos/src/**/*.metadata.json
 demos/src/**/*.css.shim.ts
-prerender.html
-prerender-domino.html
-prerender-hydrated.html
-prerender-static.html
 
 # stencil
 angular/css/
-packages/react/css/
 core/css/
-core/hydrate/
 core/loader/
-core/www/
 .stencil/
 angular/build/

.scripts/common.js

@@ -11,8 +11,6 @@ const packages = [
   'core',
   'docs',
   'angular',
-  'packages/react',
-  'packages/react-router'
 ];
 
 function readPkg(project) {
@@ -38,48 +36,34 @@ function checkGit(tasks) {
   tasks.push(
     {
       title: 'Check current branch',
-      task: () =>
-        execa.stdout('git', ['symbolic-ref', '--short', 'HEAD']).then(branch => {
-          if (branch.indexOf('release') === -1 && branch.indexOf('hotfix') === -1) {
-            throw new Error(`Must be on a "release" or "hotfix" branch.`);
-          }
-        })
+      task: () => execa.stdout('git', ['symbolic-ref', '--short', 'HEAD']).then(branch => {
+        if (branch.indexOf('release') === -1 && branch.indexOf('hotfix') === -1) {
+          throw new Error(`Must be on a "release" or "hotfix" branch.`);
+        }
+      })
     },
     {
       title: 'Check local working tree',
-      task: () =>
-        execa.stdout('git', ['status', '--porcelain']).then(status => {
-          if (status !== '') {
-            throw new Error(`Unclean working tree. Commit or stash changes first.`);
-          }
-        })
+      task: () => execa.stdout('git', ['status', '--porcelain']).then(status => {
+        if (status !== '') {
+          throw new Error(`Unclean working tree. Commit or stash changes first.`);
+        }
+      })
     },
     {
       title: 'Check remote history',
-      task: () =>
-        execa.stdout('git', ['rev-list', '--count', '--left-only', '@{u}...HEAD']).then(result => {
-          if (result !== '0') {
-            throw new Error(`Remote history differs. Please pull changes.`);
-          }
-        })
+      task: () => execa.stdout('git', ['rev-list', '--count', '--left-only', '@{u}...HEAD']).then(result => {
+        if (result !== '0') {
+          throw new Error(`Remote history differs. Please pull changes.`);
+        }
+      })
     }
   );
 }
 
-function checkTestDist(tasks) {
-  tasks.push({
-    title: 'Check dist folders for required files',
-    task: () =>
-      execa.stdout('node', ['.scripts/test-dist.js']).then(status => {
-        if (status.indexOf('✅ test.dist') === -1) {
-          throw new Error(`Test Dist did not find some required files`);
-        }
-      })
-  });
-}
-
 const isValidVersion = input => Boolean(semver.valid(input));
 
+
 function preparePackage(tasks, package, version, install) {
   const projectRoot = projectPath(package);
   const pkg = readPkg(package);
@@ -90,9 +74,7 @@ function preparePackage(tasks, package, version, install) {
       title: `${pkg.name}: validate new version`,
       task: () => {
         if (!isVersionGreater(pkg.version, version)) {
-          throw new Error(
-            `New version \`${version}\` should be higher than current version \`${pkg.version}\``
-          );
+          throw new Error(`New version \`${version}\` should be higher than current version \`${pkg.version}\``);
         }
       }
     });
@@ -100,7 +82,7 @@ function preparePackage(tasks, package, version, install) {
       projectTasks.push({
         title: `${pkg.name}: install npm dependencies`,
         task: async () => {
-          await fs.remove(path.join(projectRoot, 'node_modules'));
+          await fs.remove(path.join(projectRoot, 'node_modules'))
           await execa('npm', ['i'], { cwd: projectRoot });
         }
       });
@@ -113,13 +95,6 @@ function preparePackage(tasks, package, version, install) {
         title: `${pkg.name}: npm link @ionic/core`,
         task: () => execa('npm', ['link', '@ionic/core'], { cwd: projectRoot })
       });
-
-      if (package === 'packages/react-router') {
-        projectTasks.push({
-          title: `${pkg.name}: npm link @ionic/react`,
-          task: () => execa('npm', ['link', '@ionic/react'], { cwd: projectRoot })
-        });
-      }
     }
 
     if (version) {
@@ -130,7 +105,7 @@ function preparePackage(tasks, package, version, install) {
       projectTasks.push({
         title: `${pkg.name}: update ionic/core dep to ${version}`,
         task: () => {
-          updateDependency(pkg, '@ionic/core', version);
+          updateDependency(pkg, "@ionic/core", version);
           writePkg(package, pkg);
         }
       });
@@ -159,6 +134,7 @@ function preparePackage(tasks, package, version, install) {
   });
 }
 
+
 function prepareDevPackage(tasks, package, version) {
   const projectRoot = projectPath(package);
   const pkg = readPkg(package);
@@ -176,7 +152,7 @@ function prepareDevPackage(tasks, package, version) {
     projectTasks.push({
       title: `${pkg.name}: update ionic/core dep to ${version}`,
       task: () => {
-        updateDependency(pkg, '@ionic/core', version);
+        updateDependency(pkg, "@ionic/core", version);
         writePkg(package, pkg);
       }
     });
@@ -205,38 +181,33 @@ function updatePackageVersions(tasks, packages, version) {
   packages.forEach(package => {
     updatePackageVersion(tasks, package, version);
 
-    tasks.push({
-      title: `${package} update @ionic/core dependency, if present ${tc.dim(`(${version})`)}`,
-      task: async () => {
-        if (package !== 'core') {
-          const pkg = readPkg(package);
-          updateDependency(pkg, '@ionic/core', version);
-          writePkg(package, pkg);
-        }
-      }
-    });
-    if (package === 'packages/react-router') {
-      tasks.push({
-        title: `${package} update @ionic/react dependency, if present ${tc.dim(`(${version})`)}`,
+    tasks.push(
+      {
+        title: `${package} update @ionic/core dependency, if present ${tc.dim(`(${version})`)}`,
         task: async () => {
-          const pkg = readPkg(package);
-          updateDependency(pkg, '@ionic/react', version);
-          writePkg(package, pkg);
-        }
-      });
-    }
+          if (package !== 'core') {
+            const pkg = readPkg(package);
+            updateDependency(pkg, '@ionic/core', version);
+            writePkg(package, pkg);
+          }
+        },
+      }
+    )
   });
 }
 
+
 function updatePackageVersion(tasks, package, version) {
   const projectRoot = projectPath(package);
 
-  tasks.push({
-    title: `${package}: update package.json ${tc.dim(`(${version})`)}`,
-    task: async () => {
-      await execa('npm', ['version', version], { cwd: projectRoot });
+  tasks.push(
+    {
+      title: `${package}: update package.json ${tc.dim(`(${version})`)}`,
+      task: async () => {
+        await execa('npm', ['version', version], { cwd: projectRoot });
+      }
     }
-  });
+  );
 }
 
 function publishPackages(tasks, packages, version, tag = 'latest') {
@@ -266,7 +237,7 @@ function publishPackages(tasks, packages, version, tag = 'latest') {
       title: `${package}: publish to ${tag} tag`,
       task: async () => {
         await execa('npm', ['publish', '--tag', tag], { cwd: projectRoot });
-      }
+      },
     });
   });
 }
@@ -287,19 +258,11 @@ function isVersionGreater(oldVersion, newVersion) {
   return true;
 }
 
-function copyCDNLoader(tasks, version) {
-  tasks.push({
-    title: `Copy CDN loader`,
-    task: () => execa('node', ['copy-cdn-loader.js', version], { cwd: path.join(rootDir, 'core', 'scripts') })
-  });
-}
 
 module.exports = {
-  checkTestDist,
   checkGit,
   isValidVersion,
   isVersionGreater,
-  copyCDNLoader,
   packages,
   packagePath,
   prepareDevPackage,
@@ -311,5 +274,5 @@ module.exports = {
   updateDependency,
   updatePackageVersion,
   updatePackageVersions,
-  writePkg
+  writePkg,
 };

.scripts/prepare.js

@@ -107,17 +107,15 @@ async function preparePackages(packages, version, install) {
   });
 
   // add update package.json of each project
-  common.updatePackageVersions(tasks, packages, version);
+  packages.forEach(package => {
+    common.updatePackageVersion(tasks, package, version);
+  });
 
   // generate changelog
   generateChangeLog(tasks);
 
-  // check dist folders
-  common.checkTestDist(tasks);
-
   // update core readme with version number
   updateCoreReadme(tasks, version);
-  common.copyCDNLoader(tasks, version);
 
   const listr = new Listr(tasks, { showSubtasks: true });
   await listr.run();
@@ -173,6 +171,7 @@ function updateCoreReadme(tasks, version) {
   });
 }
 
+
 const SEMVER_INCREMENTS = ['patch', 'minor', 'major'];
 
 const isValidVersionInput = input => SEMVER_INCREMENTS.indexOf(input) !== -1 || common.isValidVersion(input);

.scripts/release-dev.js

@@ -7,7 +7,6 @@ const fs = require('fs-extra');
 
 const common = require('./common');
 
-const DIST_NPM_TAG = 'dev';
 const DIST_TAG = 'dev';
 
 async function main() {
@@ -38,8 +37,7 @@ async function main() {
     packages.forEach(package => {
       common.prepareDevPackage(tasks, package, devVersion);
     });
-    common.copyCDNLoader(tasks, devVersion);
-    common.publishPackages(tasks, packages, devVersion, DIST_NPM_TAG);
+    common.publishPackages(tasks, packages, devVersion, DIST_TAG);
 
     const listr = new Listr(tasks);
     await listr.run();

.scripts/release.js

@@ -5,7 +5,6 @@
 const tc = require('turbocolor');
 const execa = require('execa');
 const Listr = require('listr');
-const path = require('path');
 const octokit = require('@octokit/rest')()
 const common = require('./common');
 const fs = require('fs-extra');
@@ -17,8 +16,6 @@ async function main() {
       throw new Error('env.GH_TOKEN is undefined');
     }
 
-    checkProductionRelease();
-
     const tasks = [];
     const { version } = common.readPkg('core');
     const changelog = findChangelog();
@@ -42,15 +39,6 @@ async function main() {
   }
 }
 
-function checkProductionRelease() {
-  const corePath = common.projectPath('core');
-  const hasEsm = fs.existsSync(path.join(corePath, 'dist', 'esm'));
-  const hasEsmEs5 = fs.existsSync(path.join(corePath, 'dist', 'esm-es5'));
-  const hasCjs = fs.existsSync(path.join(corePath, 'dist', 'cjs'));
-  if (!hasEsm || !hasEsmEs5 || !hasCjs) {
-    throw new Error('core build is not a production build');
-  }
-}
 
 function publishGit(tasks, version, changelog) {
   const tag = `v${version}`;
@@ -66,7 +54,7 @@ function publishGit(tasks, version, changelog) {
     },
     {
       title: 'Push tags to remove',
-      task: () => execa('git', ['push', '--follow-tags'], { cwd: common.rootDir })
+      task: () => execa('git', ['push', '--tags'], { cwd: common.rootDir })
     },
     {
       title: 'Publish Github release',

.scripts/test-dist.js

@@ -1,82 +0,0 @@
-const path = require('path');
-const fs = require('fs');
-
-// Test dist build:
-// Double-triple check all the packages
-// and files are good to go before publishing
-[
-  // core
-  {
-    files: ['../core/dist/index.js', '../core/dist/ionic/index.esm.js']
-  },
-  // angular
-  {
-    files: ['../angular/dist/fesm5.cjs.js']
-  },
-  // react
-  {
-    files: ['../packages/react/dist/index.js']
-  },
-  // react-router
-  {
-    files: ['../packages/react-router/dist/index.js']
-  }
-].forEach(testPackage);
-
-function testPackage(testPkg) {
-  if (testPkg.packageJson) {
-    const pkgDir = path.dirname(testPkg.packageJson);
-    const pkgJson = require(testPkg.packageJson);
-
-    if (!pkgJson.name) {
-      throw new Error('missing package.json name: ' + testPkg.packageJson);
-    }
-
-    if (!pkgJson.main) {
-      throw new Error('missing package.json main: ' + testPkg.packageJson);
-    }
-
-    const pkgPath = path.join(pkgDir, pkgJson.main);
-    const pkgImport = require(pkgPath);
-
-    if (testPkg.files) {
-      if (!Array.isArray(pkgJson.files)) {
-        throw new Error(testPkg.packageJson + ' missing "files" property');
-      }
-      testPkg.files.forEach(testPkgFile => {
-        if (!pkgJson.files.includes(testPkgFile)) {
-          throw new Error(testPkg.packageJson + ' missing file ' + testPkgFile);
-        }
-
-        const filePath = path.join(__dirname, pkgDir, testPkgFile);
-        fs.accessSync(filePath);
-      });
-    }
-
-    if (pkgJson.module) {
-      const moduleIndex = path.join(__dirname, pkgDir, pkgJson.module);
-      fs.accessSync(moduleIndex);
-    }
-
-    if (pkgJson.types) {
-      const pkgTypes = path.join(__dirname, pkgDir, pkgJson.types);
-      fs.accessSync(pkgTypes);
-    }
-
-    if (testPkg.exports) {
-      testPkg.exports.forEach(exportName => {
-        const m = pkgImport[exportName];
-        if (!m) {
-          throw new Error('export "' + exportName + '" not found in: ' + testPkg.packageJson);
-        }
-      });
-    }
-  } else if (testPkg.files) {
-    testPkg.files.forEach(file => {
-      const filePath = path.join(__dirname, file);
-      fs.statSync(filePath);
-    });
-  }
-}
-
-console.log(`✅ test.dist`);

CHANGELOG.md

@@ -1,387 +1,10 @@
-## [4.10.1](https://github.com/ionic-team/ionic/compare/v4.10.0...v4.10.1) (2019-10-07)
-
-
-### Bug Fixes
-
-* **animation:** animation timer fallback now accounts for iterations ([#19527](https://github.com/ionic-team/ionic/issues/19527)) ([9f5ed23](https://github.com/ionic-team/ionic/commit/9f5ed23))
-* **css:** update deprecations to remove wrap ([#19535](https://github.com/ionic-team/ionic/issues/19535)) ([bfb704e](https://github.com/ionic-team/ionic/commit/bfb704e)), closes [#19499](https://github.com/ionic-team/ionic/issues/19499)
-* **header:** fix collapsing iOS header when using with split pane ([#19480](https://github.com/ionic-team/ionic/issues/19480)) ([dea1c26](https://github.com/ionic-team/ionic/commit/dea1c26)), closes [#19541](https://github.com/ionic-team/ionic/issues/19541)
-* **list:** add bottom border for first item in inset list ([#19525](https://github.com/ionic-team/ionic/issues/19525)) ([71b8853](https://github.com/ionic-team/ionic/commit/71b8853)), closes [#19507](https://github.com/ionic-team/ionic/issues/19507)
-* **md:** fix flicker when navigating back in MD mode on certain Android devices ([#19553](https://github.com/ionic-team/ionic/issues/19553)) ([19ee21a](https://github.com/ionic-team/ionic/commit/19ee21a)), closes [#19491](https://github.com/ionic-team/ionic/issues/19491)
-* **searchbar:** update padding and button alignment ([#19532](https://github.com/ionic-team/ionic/issues/19532)) ([77658e6](https://github.com/ionic-team/ionic/commit/77658e6)), closes [#19502](https://github.com/ionic-team/ionic/issues/19502)
-
-
-
-# [4.10.0 Neon](https://github.com/ionic-team/ionic/compare/v4.9.1...v4.10.0) (2019-09-27)
-
-
-### Bug Fixes
-
-* **angular:** add warning if initialized more than once ([#19393](https://github.com/ionic-team/ionic/issues/19393)) ([e98769e](https://github.com/ionic-team/ionic/commit/e98769e))
-* **animation:** set property defaults to avoid inconsistencies ([#19321](https://github.com/ionic-team/ionic/issues/19321)) ([1cbb52c](https://github.com/ionic-team/ionic/commit/1cbb52c))
-* **animation:** fallback to CSS Animations on older versions of Chrome ([#19288](https://github.com/ionic-team/ionic/issues/19288)) ([2d39c07](https://github.com/ionic-team/ionic/commit/2d39c07)), closes [#19272](https://github.com/ionic-team/ionic/issues/19272)
-* **animation:** animations of duration 0 now run in Safari ([#19287](https://github.com/ionic-team/ionic/issues/19287)) ([4e544f1](https://github.com/ionic-team/ionic/commit/4e544f1)), closes [#19285](https://github.com/ionic-team/ionic/issues/19285)
-* **components:** fix crash in IE11 when using classList add() or remove() ([#19460](https://github.com/ionic-team/ionic/issues/19460)) ([b4d92c6](https://github.com/ionic-team/ionic/commit/b4d92c6))
-* **components:** improve CSS Variable support in IE11 ([#19473](https://github.com/ionic-team/ionic/issues/19473)) ([44ad074](https://github.com/ionic-team/ionic/commit/44ad074))
-* **content:** remove pointer-events from iOS transition shadow ([#19471](https://github.com/ionic-team/ionic/issues/19471)) ([8a52c7d](https://github.com/ionic-team/ionic/commit/8a52c7d)), closes [#19466](https://github.com/ionic-team/ionic/issues/19466)
-* **menu:** menus show proper drop shadows ([#19454](https://github.com/ionic-team/ionic/issues/19454)) ([eab0865](https://github.com/ionic-team/ionic/commit/eab0865)), closes [#19387](https://github.com/ionic-team/ionic/issues/19387)
-* **radio-group:** get radios before caching value to avoid infinite loop ([#19448](https://github.com/ionic-team/ionic/issues/19448)) ([cf223e4](https://github.com/ionic-team/ionic/commit/cf223e4)), closes [#19277](https://github.com/ionic-team/ionic/issues/19277)
-* **react:** update events to use proper types ([c79e74b](https://github.com/ionic-team/ionic/commit/c79e74b))
-* **router-outlet:** hide leaving view after transition finishes ([#19335](https://github.com/ionic-team/ionic/issues/19335)) ([bfa17d1](https://github.com/ionic-team/ionic/commit/bfa17d1))
-
-
-### Features
-
-* **config:** expose getMode() and deprecate Config.set() ([#19104](https://github.com/ionic-team/ionic/issues/19104)) ([0f05ea4](https://github.com/ionic-team/ionic/commit/0f05ea4))
-* **docs:** add VSCode docs support ([#19309](https://github.com/ionic-team/ionic/issues/19309)) ([a3f345c](https://github.com/ionic-team/ionic/commit/a3f345c))
-* **title:** add support for small title ([#19215](https://github.com/ionic-team/ionic/issues/19215)) ([e27962d](https://github.com/ionic-team/ionic/commit/e27962d)), closes [#18898](https://github.com/ionic-team/ionic/issues/18898)
-* **title:** add support for large title (experimental) ([#19268](https://github.com/ionic-team/ionic/issues/19268)) ([923312e](https://github.com/ionic-team/ionic/commit/923312e)), closes [#16885](https://github.com/ionic-team/ionic/issues/16885)
-
-
-### Performance Improvements
-
-* **animation:** avoid ngzone with requestAnimationFrame ([#19457](https://github.com/ionic-team/ionic/issues/19457)) ([8ca97ce](https://github.com/ionic-team/ionic/commit/8ca97ce))
-
-
-
-## [4.9.1](https://github.com/ionic-team/ionic/compare/v4.9.0...v4.9.1) (2019-09-16)
-
-
-### Bug Fixes
-
-* **platform:** properly detect iPads running iPadOS ([#19258](https://github.com/ionic-team/ionic/issues/19258)) ([4a90096](https://github.com/ionic-team/ionic/commit/4a90096))
-
-
-
-# [4.9.0 Fluorine](https://github.com/ionic-team/ionic/compare/v4.8.1...v4.9.0) (2019-09-04)
-
-
-### Bug Fixes
-
-* **all:** allow elements to be reused once removed from the DOM ([#18963](https://github.com/ionic-team/ionic/pull/18963)) ([48a2763](https://github.com/ionic-team/ionic/commit/48a2763)), closes [#18843](https://github.com/ionic-team/ionic/issues/18843) [#17344](https://github.com/ionic-team/ionic/issues/17344) [#16453](https://github.com/ionic-team/ionic/issues/16453) [#15879](https://github.com/ionic-team/ionic/issues/15879) [#15788](https://github.com/ionic-team/ionic/issues/15788) [#15484](https://github.com/ionic-team/ionic/issues/15484) [#17890](https://github.com/ionic-team/ionic/issues/17890) [#16364](https://github.com/ionic-team/ionic/issues/16364)
-* **animation:** add correct `onFinish` interface parameters ([#19199](https://github.com/ionic-team/ionic/issues/19199)) ([a81653b](https://github.com/ionic-team/ionic/commit/a81653b))
-* **animation:** improve Web Animation feature detection accuracy ([#19212](https://github.com/ionic-team/ionic/issues/19212)) ([6eca5b0](https://github.com/ionic-team/ionic/commit/6eca5b0)), closes [#19205](https://github.com/ionic-team/ionic/issues/19205)
-* **animation:** properly clean up elements when using `destroy` ([#19210](https://github.com/ionic-team/ionic/issues/19210)) ([93f2064](https://github.com/ionic-team/ionic/commit/93f2064))
-* **segment:** do not emit ionChange until didLoad ([#19218](https://github.com/ionic-team/ionic/issues/19218)) ([9751f14](https://github.com/ionic-team/ionic/commit/9751f14)), closes [#19204](https://github.com/ionic-team/ionic/issues/19204)
-
-### Features
-
-* **nav-link:** add `nav-link` and deprecate `nav-push`, `nav-pop`, and `nav-set-root` ([#18909](https://github.com/ionic-team/ionic/issues/18909)) ([c3044f5](https://github.com/ionic-team/ionic/commit/c3044f5))
-* **slides:** expose full Swiper API ([#19137](https://github.com/ionic-team/ionic/issues/19137)) ([e1fa461](https://github.com/ionic-team/ionic/commit/e1fa461))
-
-
-
-## [4.8.1](https://github.com/ionic-team/ionic/compare/v4.8.0...v4.8.1) (2019-08-27)
-
-
-### Bug Fixes
-
-* **animation:** enable backwards compatibility for overlay animations ([#19160](https://github.com/ionic-team/ionic/issues/19160)) ([fb70980](https://github.com/ionic-team/ionic/commit/fb70980))
-* **gesture:** account for negative step values with Web Animations ([#19196](https://github.com/ionic-team/ionic/issues/19196)) ([b3c7436](https://github.com/ionic-team/ionic/commit/b3c7436))
-* **ios:** clear opacity on toolbar background after iOS transition ([#19169](https://github.com/ionic-team/ionic/issues/19169)) ([fa958a5](https://github.com/ionic-team/ionic/commit/fa958a5))
-* **md:** set fill mode on MD transition to `both` ([#19161](https://github.com/ionic-team/ionic/issues/19161)) ([0e8ab49](https://github.com/ionic-team/ionic/commit/0e8ab49))
-
-
-
-# [4.8.0 Oxygen](https://github.com/ionic-team/ionic/compare/v4.7.4...v4.8.0) (2019-08-21)
-
-
-### Bug Fixes
-
-* **alert:** apply styling to disabled items ([#18545](https://github.com/ionic-team/ionic/issues/18545)) ([67ed89d](https://github.com/ionic-team/ionic/commit/67ed89d))
-* **platform:** properly detect Electron platform ([#19044](https://github.com/ionic-team/ionic/issues/19044)) ([e8cdda0](https://github.com/ionic-team/ionic/commit/e8cdda0)), closes [#19043](https://github.com/ionic-team/ionic/issues/19043)
-* **toggle:** change background to use CSS variable ([#19012](https://github.com/ionic-team/ionic/issues/19012)) ([94e525c](https://github.com/ionic-team/ionic/commit/94e525c)), closes [#18940](https://github.com/ionic-team/ionic/issues/18940)
-* **transition:** enable iOS transition shadow by default ([#19051](https://github.com/ionic-team/ionic/issues/19051)) ([a5d3c6b](https://github.com/ionic-team/ionic/commit/a5d3c6b))
-
-
-### Features
-
-* **animation:** add animation utility (experimental) ([#18918](https://github.com/ionic-team/ionic/issues/18918)) ([30ca46a](https://github.com/ionic-team/ionic/commit/30ca46a))
-* **gesture:** add gesture utility (experimental) ([#18918](https://github.com/ionic-team/ionic/issues/18918)) ([30ca46a](https://github.com/ionic-team/ionic/commit/30ca46a))
-* **searchbar:** add `inputmode` property ([#18980](https://github.com/ionic-team/ionic/issues/18980)) ([1187dc2](https://github.com/ionic-team/ionic/commit/1187dc2))
-* **spinner:** add circular spinner for MD default ([#19052](https://github.com/ionic-team/ionic/issues/19052)) ([e33cf85](https://github.com/ionic-team/ionic/commit/e33cf85))
-
-
-
-## [4.7.4](https://github.com/ionic-team/ionic/compare/v4.7.3...v4.7.4) (2019-08-07)
-
-
-### Bug Fixes
-
-* **core:** remove extra semicolons being rendered ([#19033](https://github.com/ionic-team/ionic/issues/19033)) ([39f0768](https://github.com/ionic-team/ionic/commit/39f0768))
-
-
-
-## [4.7.3](https://github.com/ionic-team/ionic/compare/v4.7.2...v4.7.3) (2019-08-07)
-
-* **core:** fix an issue with production builds of `@ionic/core`
-
-
-
-## [4.7.2](https://github.com/ionic-team/ionic/compare/v4.7.1...v4.7.2) (2019-08-07)
-
-
-### Bug Fixes
-
-* **angular:** hardware back button subscribeWithPriority triggers change detection ([#18962](https://github.com/ionic-team/ionic/issues/18962)) ([3a22105](https://github.com/ionic-team/ionic/commit/3a22105)), closes [#18959](https://github.com/ionic-team/ionic/issues/18959)
-* **angular:** nested inputs no longer conflict with each other ([#18976](https://github.com/ionic-team/ionic/issues/18976)) ([6bbdb80](https://github.com/ionic-team/ionic/commit/6bbdb80)), closes [#18248](https://github.com/ionic-team/ionic/issues/18248)
-* **range:** ion-range value now submitted with form ([#19008](https://github.com/ionic-team/ionic/issues/19008)) ([8f7853c](https://github.com/ionic-team/ionic/commit/8f7853c))
-* **reorder:** only move item if reorder happens ([#19007](https://github.com/ionic-team/ionic/issues/19007)) ([d237e80](https://github.com/ionic-team/ionic/commit/d237e80))
-* **router:** partial swipe to go back gesture no longer breaks view([#18977](https://github.com/ionic-team/ionic/issues/18977)) ([713ea8a](https://github.com/ionic-team/ionic/commit/713ea8a)), closes [#18462](https://github.com/ionic-team/ionic/issues/18462)
-* **toast:** allow loading ion-icon from asset path ([#18969](https://github.com/ionic-team/ionic/issues/18969)) ([23f327e](https://github.com/ionic-team/ionic/commit/23f327e))
-* **vue:** rename swipeEnable to swipeGesture ([#17346](https://github.com/ionic-team/ionic/issues/17346)) ([c2348f7](https://github.com/ionic-team/ionic/commit/c2348f7)), closes [#16002](https://github.com/ionic-team/ionic/issues/16002)
-
-
-
-## [4.7.1](https://github.com/ionic-team/ionic/compare/v4.7.0...v4.7.1) (2019-07-26)
-
-
-### Bug Fixes
-
-* **angular:** ensure change detection fires properly ([#18896](https://github.com/ionic-team/ionic/issues/18896)) ([962783b](https://github.com/ionic-team/ionic/commit/962783b)), closes [#18894](https://github.com/ionic-team/ionic/issues/18894)
-
-
-
-# [4.7.0 Nitrogen](https://github.com/ionic-team/ionic/compare/v4.6.2...v4.7.0) (2019-07-24)
-
-
-### Angular 8 Support
-
-With this version comes support for Angular 8! Follow the below steps to update.
-
-1. Update `@ionic/angular` and `@ionic/angular-toolkit` to the latest releases:
-
-    ```shell
-    $ npm install @ionic/angular@4.7.0
-    $ npm install @ionic/angular-toolkit@2.0.0 -D
-    ```
-
-1. Update `@angular/core` and `@angular/cli`:
-
-    ```shell
-    $ npx ng update @angular/core @angular/cli
-    ```
-
-1. Update `@angular-devkit` dependencies:
-
-    ```shell
-    $ npm i @angular-devkit/architect@latest @angular-devkit/build-angular@latest @angular-devkit/core@latest @angular-devkit/schematics@latest
-    ```
-
-View our [Angular 8 Update Guide](https://docs.google.com/document/d/1QOpQeDifPSg6F9WycDLcbQnpqjN96ew-Ap0_CB7CcCQ/edit?usp=sharing) for tips on potential issues!
-
-### Bug Fixes
-
-* **angular:** copy input form classes to parent ion-item ([#18820](https://github.com/ionic-team/ionic/issues/18820)) ([53179c4](https://github.com/ionic-team/ionic/commit/53179c4)), closes [#18800](https://github.com/ionic-team/ionic/issues/18800)
-* **angular:** add the swipeGesture method for enabling or disabling the ability to swipe open a menu ([#18806](https://github.com/ionic-team/ionic/issues/18806)) ([fbfc076](https://github.com/ionic-team/ionic/commit/fbfc076)), closes [#16002](https://github.com/ionic-team/ionic/issues/16002)
-* **angular:** webview "pause", "resume", and "resize" events now trigger change detection ([#18853](https://github.com/ionic-team/ionic/issues/18853)) ([544e550](https://github.com/ionic-team/ionic/commit/544e550)), closes [#18831](https://github.com/ionic-team/ionic/issues/18831)
-* **core:** apply translucent if backdrop-filter is supported ([#18832](https://github.com/ionic-team/ionic/issues/18832)) ([6b5a59d](https://github.com/ionic-team/ionic/commit/6b5a59d)), closes [ionic-team/ionic-docs#666](https://github.com/ionic-team/ionic-docs/issues/666)
-* **datetime:** allow AM/PM to be changed ([#18684](https://github.com/ionic-team/ionic/issues/18684)) ([b7761fe](https://github.com/ionic-team/ionic/commit/b7761fe)), closes [#18585](https://github.com/ionic-team/ionic/issues/18585)
-* **datetime:** properly apply disabled classes when updating columns ([#18875](https://github.com/ionic-team/ionic/issues/18875)) ([7ba718c](https://github.com/ionic-team/ionic/commit/7ba718c)), closes [#18793](https://github.com/ionic-team/ionic/issues/18793)
-* **hardware-back-button:** hardware back button no longer erroneously restarts app ([#18794](https://github.com/ionic-team/ionic/issues/18794)) ([978cc39](https://github.com/ionic-team/ionic/commit/978cc39)), closes [#18792](https://github.com/ionic-team/ionic/issues/18792)
-* **ripple-effect:** ensure ripple is removed from components after pointer release ([#18854](https://github.com/ionic-team/ionic/issues/18854)) ([71137a2](https://github.com/ionic-team/ionic/commit/71137a2)), closes [#18836](https://github.com/ionic-team/ionic/issues/18836)
-* **searchbar:** add aria and role for improved accessibility ([#18797](https://github.com/ionic-team/ionic/issues/18797)) ([798103b](https://github.com/ionic-team/ionic/commit/798103b)), closes [#18796](https://github.com/ionic-team/ionic/issues/18796)
-* **ssr:** avoid window reference ([#18865](https://github.com/ionic-team/ionic/issues/18865)) ([23ce6fa](https://github.com/ionic-team/ionic/commit/23ce6fa))
-* **ssr:** check for client runtime method ([#18866](https://github.com/ionic-team/ionic/issues/18866)) ([c52b3b4](https://github.com/ionic-team/ionic/commit/c52b3b4))
-* **textarea:** autogrow now resets textarea back to original number of rows when text is cleared ([#18822](https://github.com/ionic-team/ionic/issues/18822)) ([26e6d6f](https://github.com/ionic-team/ionic/commit/26e6d6f)), closes [#18744](https://github.com/ionic-team/ionic/issues/18744)
-* **theming:** update components to use the proper colors for dark themes ([#18735](https://github.com/ionic-team/ionic/issues/18735)) ([045bc59](https://github.com/ionic-team/ionic/commit/045bc59)), closes [#18713](https://github.com/ionic-team/ionic/issues/18713)
-* **virtual-scroll:** card rendering is no longer distorted ([#18877](https://github.com/ionic-team/ionic/issues/18877)) ([3ef6ecf](https://github.com/ionic-team/ionic/commit/3ef6ecf)), closes [#18870](https://github.com/ionic-team/ionic/issues/18870)
-* **virtual-scroll:** element dimensions are recalculated on resize ([#18878](https://github.com/ionic-team/ionic/issues/18878)) ([c91819c](https://github.com/ionic-team/ionic/commit/c91819c))
-
-
-### Features
-
-* **core:** add support for Stackblitz ([#18846](https://github.com/ionic-team/ionic/issues/18846)) ([fb18f3b](https://github.com/ionic-team/ionic/commit/fb18f3b))
-* **ssr:** add @ionic/core/hydrate app ([#18867](https://github.com/ionic-team/ionic/issues/18867)) ([815fa2e](https://github.com/ionic-team/ionic/commit/815fa2e))
-* **navigation:** add experimental shadow to iOS page transitions ([#18695](https://github.com/ionic-team/ionic/issues/18695)) ([9b075ef](https://github.com/ionic-team/ionic/commit/9b075ef)), closes [#18661](https://github.com/ionic-team/ionic/issues/18661)
-* **virtual-scroll:** adds headerHeight and footerHeight to help prevent flickering ([#18851](https://github.com/ionic-team/ionic/issues/18851)) ([0089111](https://github.com/ionic-team/ionic/commit/0089111)), closes [#17540](https://github.com/ionic-team/ionic/issues/17540)
-
-
-### Performance
-
-* **angular:** attach entering view before first change detection and detach leaving page ([#18821](https://github.com/ionic-team/ionic/issues/18821)) ([97fec92](https://github.com/ionic-team/ionic/commit/97fec92))
-
-
-## [4.6.2](https://github.com/ionic-team/ionic/compare/v4.6.1...v4.6.2) (2019-07-10)
-
-
-### Bug Fixes
-
-* **menu-button:** hide menu button when auto hide or split pane ([#18702](https://github.com/ionic-team/ionic/issues/18702)) ([24840d4](https://github.com/ionic-team/ionic/commit/24840d4)), closes [#18666](https://github.com/ionic-team/ionic/issues/18666)
-* **menu-button:** move font-size to host for easier customization ([#18699](https://github.com/ionic-team/ionic/issues/18699)) ([876ab41](https://github.com/ionic-team/ionic/commit/876ab41)), closes [#18667](https://github.com/ionic-team/ionic/issues/18667)
-* **overlays:** fallback to step color if overlay background variable is unset ([#18709](https://github.com/ionic-team/ionic/issues/18709)) ([f16b118](https://github.com/ionic-team/ionic/commit/f16b118)), closes [#18658](https://github.com/ionic-team/ionic/issues/18658)
-* **virtual-scroll:**  remove runOutsideAngular error ([#18752](https://github.com/ionic-team/ionic/issues/18752)) ([8beeff2](https://github.com/ionic-team/ionic/commit/8beeff2)), closes [#18746](https://github.com/ionic-team/ionic/issues/18746)
-* **vue:** update imports for types and ionicons ([f56fea6](https://github.com/ionic-team/ionic/commit/f56fea6)), closes [#18701](https://github.com/ionic-team/ionic/issues/18701)
-
-
-### Performance Improvements
-
-* **all:** minify better by using arrow functions ([#18730](https://github.com/ionic-team/ionic/issues/18730)) ([03c1d19](https://github.com/ionic-team/ionic/commit/03c1d19))
-
-
-
-## [4.6.1](https://github.com/ionic-team/ionic/compare/v4.6.0...v4.6.1) (2019-07-09)
-
-
-### Bug Fixes
-
-* **app:** add hydrated to hide white screen with multiple ionic dependencies ([#18649](https://github.com/ionic-team/ionic/issues/18649))
-* **datetime:** datetime no longer reports having a value if none is set ([#18541](https://github.com/ionic-team/ionic/issues/18541)) ([92e0f98](https://github.com/ionic-team/ionic/commit/92e0f98)), closes [#17979](https://github.com/ionic-team/ionic/issues/17979) [#18540](https://github.com/ionic-team/ionic/issues/18540)
-* **fab-button:** set opacity on disabled fab button ([#18685](https://github.com/ionic-team/ionic/issues/18685)) ([6042b39](https://github.com/ionic-team/ionic/commit/6042b39)), closes [#18682](https://github.com/ionic-team/ionic/issues/18682)
-* **icon:** load icons properly with baseHref ([#18650](https://github.com/ionic-team/ionic/issues/18650)), ([#18637](https://github.com/ionic-team/ionic/issues/18637))
-* **icon:** bind icon name properly ([#18707](https://github.com/ionic-team/ionic/issues/18707))
-* **infinite-scroll:** fix scroll listener ([0d58101](https://github.com/ionic-team/ionic/commit/0d58101))
-* **item:** do not disable entire item if there are multiple inputs ([#18696](https://github.com/ionic-team/ionic/issues/18696)) ([dfa2b13](https://github.com/ionic-team/ionic/commit/dfa2b13)), closes [#18655](https://github.com/ionic-team/ionic/issues/18655) [#18670](https://github.com/ionic-team/ionic/issues/18670)
-* **router-link:** add missing target prop ([#18659](https://github.com/ionic-team/ionic/issues/18659)) ([1f51ab2](https://github.com/ionic-team/ionic/commit/1f51ab2)), closes [#18655](https://github.com/ionic-team/ionic/issues/18655)
-* **router-outlet:** fix swipe to go back ([b69fb69](https://github.com/ionic-team/ionic/commit/b69fb69))
-* **scss:** copy all scss files ([36a58df](https://github.com/ionic-team/ionic/commit/36a58df))
-* **searchbar:** proper styling after navigating ([#18642](https://github.com/ionic-team/ionic/issues/18642))
-* **slides:** use correct order for pushing slides dynamically ([#18633](https://github.com/ionic-team/ionic/issues/18633))
-* **tabs:** select proper tab by default and do not emit tab change if selectedTab is undefined ([03c834c](https://github.com/ionic-team/ionic/commit/03c834c))
-* **overlay:** make create opts optional ([44c88ad](https://github.com/ionic-team/ionic/commit/44c88ad))
-
-
-### Performance Improvements
-
-* **angular:** skip zone ([e059fc8](https://github.com/ionic-team/ionic/commit/e059fc8))
-
-
-
-# [4.6.0 Carbon](https://github.com/ionic-team/ionic/compare/v4.5.0...v4.6.0) (2019-06-26)
-
-
-### Bug Fixes
-
-* **button:** default opacity for disabled clear buttons ([#18560](https://github.com/ionic-team/ionic/issues/18560)) ([f48dc3d](https://github.com/ionic-team/ionic/commit/f48dc3d)), closes [#18555](https://github.com/ionic-team/ionic/issues/18555)
-* **button:** update solid buttons to use tint and shade colors ([#18537](https://github.com/ionic-team/ionic/issues/18537)) ([26ecf2b](https://github.com/ionic-team/ionic/commit/26ecf2b))
-* **menu:** change ARIA role from complementary to navigation ([#18330](https://github.com/ionic-team/ionic/issues/18330)) ([9e4346b](https://github.com/ionic-team/ionic/commit/9e4346b)), closes [#18318](https://github.com/ionic-team/ionic/issues/18318)
-* **segment:** apply hover properly for segment with color ([#18549](https://github.com/ionic-team/ionic/issues/18549)) ([78e477b](https://github.com/ionic-team/ionic/commit/78e477b))
-* **segment:** default ripple to currentColor ([#18547](https://github.com/ionic-team/ionic/issues/18547)) ([832306c](https://github.com/ionic-team/ionic/commit/832306c))
-
-
-### Features
-
-* **components:** add missing button/a props to components that render them ([#17883](https://github.com/ionic-team/ionic/issues/17883)) ([eca4121](https://github.com/ionic-team/ionic/commit/eca4121)), closes [#16848](https://github.com/ionic-team/ionic/issues/16848) [#16889](https://github.com/ionic-team/ionic/issues/16889)
-* **fab-button:** add hover state using tint colors ([#18536](https://github.com/ionic-team/ionic/issues/18536)) ([ad00679](https://github.com/ionic-team/ionic/commit/ad00679)), closes [#17624](https://github.com/ionic-team/ionic/issues/17624)
-* **item:** add hover and focused states ([#18606](https://github.com/ionic-team/ionic/issues/18606)) ([8a88dd2](https://github.com/ionic-team/ionic/commit/8a88dd2)), closes [#18279](https://github.com/ionic-team/ionic/issues/18279) [#17624](https://github.com/ionic-team/ionic/issues/17624)
-* **router-link:** add router-link and deprecate anchor ([#18620](https://github.com/ionic-team/ionic/issues/18620)) ([d4c7b03](https://github.com/ionic-team/ionic/commit/d4c7b03))
-
-
-### Enhancements
-
-* **stencil:** update to Stencil One to improve app performance 🎉🎊 ([b40f7d3](https://github.com/ionic-team/ionic/commit/b40f7d3))
-
-
-
-# [4.5.0 Boron](https://github.com/ionic-team/ionic/compare/v4.4.2...v4.5.0) (2019-06-12)
-
-
-### Bug Fixes
-
-* **angular:** ensure all NavigationExtras values are preserved when navigating ([#18468](https://github.com/ionic-team/ionic/issues/18468)) ([7610787](https://github.com/ionic-team/ionic/commit/7610787)), closes [#18469](https://github.com/ionic-team/ionic/issues/18469)
-* **button:** set opacity on the host element for disabled button ([#18509](https://github.com/ionic-team/ionic/issues/18509)) ([320719b](https://github.com/ionic-team/ionic/commit/320719b)), closes [#16965](https://github.com/ionic-team/ionic/issues/16965)
-* **button:** use correct border-radius on menu and back button ([#18501](https://github.com/ionic-team/ionic/issues/18501)) ([055e125](https://github.com/ionic-team/ionic/commit/055e125)), closes [#17624](https://github.com/ionic-team/ionic/issues/17624)
-* **button:** use correct size on a dynamic button in an item ([#18395](https://github.com/ionic-team/ionic/issues/18395)) ([a3e23fc](https://github.com/ionic-team/ionic/commit/a3e23fc)), closes [#18085](https://github.com/ionic-team/ionic/issues/18085)
-* **card:** remove white space from bottom of card ([#18328](https://github.com/ionic-team/ionic/issues/18328)) ([d53e7aa](https://github.com/ionic-team/ionic/commit/d53e7aa))
-* **content:** prevent ion-searchbar from receiving padding adjustment when keyboard is open ([#18008](https://github.com/ionic-team/ionic/issues/18008)) ([b2290a6](https://github.com/ionic-team/ionic/commit/b2290a6)), closes [#18007](https://github.com/ionic-team/ionic/issues/18007)
-* **datetime:** recalculate time columns on change ([#18380](https://github.com/ionic-team/ionic/issues/18380)) ([292b24a](https://github.com/ionic-team/ionic/commit/292b24a))
-* **item:** start align the content under stacked and floating labels ([#18379](https://github.com/ionic-team/ionic/issues/18379)) ([f0af707](https://github.com/ionic-team/ionic/commit/f0af707)), closes [#16375](https://github.com/ionic-team/ionic/issues/16375)
-* **item:** inherit overflow to allow better customization ([#18502](https://github.com/ionic-team/ionic/issues/18502)) ([8d2a47e](https://github.com/ionic-team/ionic/commit/8d2a47e)), closes [#17670](https://github.com/ionic-team/ionic/issues/17670)
-* **item:** use a step color if the activated background is not set ([#18450](https://github.com/ionic-team/ionic/issues/18450)) ([1899c13](https://github.com/ionic-team/ionic/commit/1899c13)), closes [#18449](https://github.com/ionic-team/ionic/issues/18449)
-* **item-sliding:** use the correct gesture direction and side for rtl ([#18366](https://github.com/ionic-team/ionic/issues/18366)) ([4545100](https://github.com/ionic-team/ionic/commit/4545100)), closes [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **label:** include the ion-text-wrap class styles for larger font ([#18374](https://github.com/ionic-team/ionic/issues/18374)) ([4bba540](https://github.com/ionic-team/ionic/commit/4bba540))
-* **platform:** prevent error with Platform.is on Android 4.4 ([#18387](https://github.com/ionic-team/ionic/issues/18387)) ([54bdb36](https://github.com/ionic-team/ionic/commit/54bdb36))
-* **react:** ensure element exists in controller before dismissing it ([0fd3e5d](https://github.com/ionic-team/ionic/commit/0fd3e5d))
-* **slides:** resolve issue where double tap to zoom was enabled by default ([10de1da](https://github.com/ionic-team/ionic/commit/10de1da)), closes [#18035](https://github.com/ionic-team/ionic/issues/18035)
-* **tabs:** allow selection on enter and spacebar press ([#18381](https://github.com/ionic-team/ionic/issues/18381)) ([11cde99](https://github.com/ionic-team/ionic/commit/11cde99)), closes [#18363](https://github.com/ionic-team/ionic/issues/18363)
-* **textarea:** inherit white-space for better customization ([#18508](https://github.com/ionic-team/ionic/issues/18508)) ([a583902](https://github.com/ionic-team/ionic/commit/a583902)), closes [#18495](https://github.com/ionic-team/ionic/issues/18495)
-* **virtual-scroll:** do not crash with an empty cell list ([#17799](https://github.com/ionic-team/ionic/issues/17799)) ([20c146e](https://github.com/ionic-team/ionic/commit/20c146e))
-
-
-### Features
-
-* **back-button:** add variables and support for focused and hover states ([#18451](https://github.com/ionic-team/ionic/issues/18451)) ([58672fb](https://github.com/ionic-team/ionic/commit/58672fb)), closes [#18465](https://github.com/ionic-team/ionic/issues/18465)
-* **button:** add variables for customizing hover state ([#18499](https://github.com/ionic-team/ionic/issues/18499)) ([5c5934b](https://github.com/ionic-team/ionic/commit/5c5934b)), closes [#17974](https://github.com/ionic-team/ionic/issues/17974)
-* **item-divider:** add inner padding CSS variables ([#18490](https://github.com/ionic-team/ionic/issues/18490)) ([35c143a](https://github.com/ionic-team/ionic/commit/35c143a)), closes [#18484](https://github.com/ionic-team/ionic/issues/18484)
-* **menu-button:** add variables for hover and focused states ([#18434](https://github.com/ionic-team/ionic/issues/18434)) ([5ba0aa9](https://github.com/ionic-team/ionic/commit/5ba0aa9)), closes [#18279](https://github.com/ionic-team/ionic/issues/18279)
-* **searchbar:** add cancel button options ([b959e0b](https://github.com/ionic-team/ionic/commit/b959e0b))
-* **toast:** allow html content ([#18423](https://github.com/ionic-team/ionic/issues/18423)) ([c8104a2](https://github.com/ionic-team/ionic/commit/c8104a2))
-
-
-
-## [4.4.2](https://github.com/ionic-team/ionic/compare/v4.4.1...v4.4.2) (2019-05-22)
-
-
-### Bug Fixes
-
-* **angular:** account for query params and fragments within a string when navigating ([#18356](https://github.com/ionic-team/ionic/issues/18356)) ([b79f68a](https://github.com/ionic-team/ionic/commit/b79f68a))
-
-
-
-## [4.4.1](https://github.com/ionic-team/ionic/compare/v4.4.0...v4.4.1) (2019-05-22)
-
-
-### Bug Fixes
-
-* **angular:** ensure active page is not removed from change detection ([#18299](https://github.com/ionic-team/ionic/issues/18299)) ([b8d4961](https://github.com/ionic-team/ionic/commit/b8d4961)), closes [#18293](https://github.com/ionic-team/ionic/issues/18293)
-* **angular:** preserve queryParams and fragment when going back ([#18298](https://github.com/ionic-team/ionic/issues/18298)) ([bdd5109](https://github.com/ionic-team/ionic/commit/bdd5109)), closes [#16744](https://github.com/ionic-team/ionic/issues/16744)
-* **buttons:** use theme/color toolbar colors for buttons ([#18191](https://github.com/ionic-team/ionic/issues/18191)) ([0511989](https://github.com/ionic-team/ionic/commit/0511989)), closes [#18184](https://github.com/ionic-team/ionic/issues/18184) [#17840](https://github.com/ionic-team/ionic/issues/17840)
-* **datetime:** update label direction in RTL ([#18340](https://github.com/ionic-team/ionic/issues/18340)) ([17345ef](https://github.com/ionic-team/ionic/commit/17345ef))
-* **fab:** position fab buttons properly in RTL ([#18325](https://github.com/ionic-team/ionic/issues/18325)) ([845def8](https://github.com/ionic-team/ionic/commit/845def8)), references [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **icon:** remove stroke and move fill to host element ([#18241](https://github.com/ionic-team/ionic/issues/18241)) ([394cf8d](https://github.com/ionic-team/ionic/commit/394cf8d)), closes [#16483](https://github.com/ionic-team/ionic/issues/16483)
-* **input:** keep entire input in view when scrolling with keyboard open ([#18253](https://github.com/ionic-team/ionic/issues/18253)) ([3cad778](https://github.com/ionic-team/ionic/commit/3cad778)), closes [#17457](https://github.com/ionic-team/ionic/issues/17457)
-* **label:** position floating/stacked labels properly in RTL ([#18315](https://github.com/ionic-team/ionic/issues/18315)) ([00a27dc](https://github.com/ionic-team/ionic/commit/00a27dc)), references [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **loading:** allow html content ([#18242](https://github.com/ionic-team/ionic/issues/18242)) ([a6cb5f2](https://github.com/ionic-team/ionic/commit/a6cb5f2)), closes [#18135](https://github.com/ionic-team/ionic/issues/18135)
-* **overlay:** hide scrollbars on non-scrollable content ([#16767](https://github.com/ionic-team/ionic/issues/16767)) ([875d563](https://github.com/ionic-team/ionic/commit/875d563)), closes [#14178](https://github.com/ionic-team/ionic/issues/14178)
-* **picker:** update the column positions in RTL ([#18339](https://github.com/ionic-team/ionic/issues/18339)) ([788a56c](https://github.com/ionic-team/ionic/commit/788a56c)), closes [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **range:** update border-radius on range pin for RTL ([#18321](https://github.com/ionic-team/ionic/issues/18321)) ([4855351](https://github.com/ionic-team/ionic/commit/4855351)), closes [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **searchbar:** position buttons properly in RTL ([#18325](https://github.com/ionic-team/ionic/issues/18325)) ([845def8](https://github.com/ionic-team/ionic/commit/845def8)), references [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **segment:** update segment border for RTL ([#18326](https://github.com/ionic-team/ionic/issues/18326)) ([805b225](https://github.com/ionic-team/ionic/commit/805b225)), closes [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **slides:** allow clicks to propagate to buttons ([#16728](https://github.com/ionic-team/ionic/issues/16728)) ([a8f9dfe](https://github.com/ionic-team/ionic/commit/a8f9dfe))
-* **tab-button:** apply background-focused when tabbing into tab button ([#17502](https://github.com/ionic-team/ionic/issues/17502)) ([d788a8e](https://github.com/ionic-team/ionic/commit/d788a8e)), closes [#17042](https://github.com/ionic-team/ionic/issues/17042)
-* **tabs:** position badge properly in RTL (only in Chrome) ([#18325](https://github.com/ionic-team/ionic/issues/18325)) ([845def8](https://github.com/ionic-team/ionic/commit/845def8)), references [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **tabs:** select the tab called by the select method after initialization ([#18300](https://github.com/ionic-team/ionic/issues/18300)) ([da38647](https://github.com/ionic-team/ionic/commit/da38647)), closes [#17957](https://github.com/ionic-team/ionic/issues/17957)
-* **toggle:** position toggle icon properly in RTL ([#18325](https://github.com/ionic-team/ionic/issues/18325)) ([845def8](https://github.com/ionic-team/ionic/commit/845def8)), references [#17012](https://github.com/ionic-team/ionic/issues/17012)
-* **toolbar:** update md toolbar button spacing and padding to match spec ([#17537](https://github.com/ionic-team/ionic/issues/17537)) ([fa87e35](https://github.com/ionic-team/ionic/commit/fa87e35)), closes [#16950](https://github.com/ionic-team/ionic/issues/16950) [#14444](https://github.com/ionic-team/ionic/issues/14444)
-
-
-
-# [4.4.0 Beryllium](https://github.com/ionic-team/ionic/compare/v4.3.1...v4.4.0) (2019-05-08)
-
-
-### Bug Fixes
-
-* **button:** apply round property to button sizes in iOS ([#18125](https://github.com/ionic-team/ionic/issues/18125)) ([ae0eccc](https://github.com/ionic-team/ionic/commit/ae0eccc)), closes [#18108](https://github.com/ionic-team/ionic/issues/18108)
-* **datetime:** default to current date when value is null ([#18105](https://github.com/ionic-team/ionic/issues/18105)) ([ca233b5](https://github.com/ionic-team/ionic/commit/ca233b5)), closes [#18099](https://github.com/ionic-team/ionic/issues/18099)
-* **input:** clear on edit from inside native input ([#17115](https://github.com/ionic-team/ionic/issues/17115)) ([85093d6](https://github.com/ionic-team/ionic/commit/85093d6)), closes [#17055](https://github.com/ionic-team/ionic/issues/17055)
-* **item:** use the global activated background for md ripple color ([#16752](https://github.com/ionic-team/ionic/issues/16752)) ([95945c0](https://github.com/ionic-team/ionic/commit/95945c0)), closes [#16585](https://github.com/ionic-team/ionic/issues/16585)
-* **label:** use primary color on focus for md input labels ([#18183](https://github.com/ionic-team/ionic/issues/18183)) ([ddb8ef8](https://github.com/ionic-team/ionic/commit/ddb8ef8)), closes [#15602](https://github.com/ionic-team/ionic/issues/15602)
-* **menu** add prefixed transform for side menu animation ([#18128](https://github.com/ionic-team/ionic/issues/18128)) ([2457a23](https://github.com/ionic-team/ionic/commit/2457a23)), closes [#17729](https://github.com/ionic-team/ionic/issues/17729)
-* **reorder-group:** remove required parameter for the complete method ([#18084](https://github.com/ionic-team/ionic/issues/18084)) ([bd96491](https://github.com/ionic-team/ionic/commit/bd96491)), closes [#16302](https://github.com/ionic-team/ionic/issues/16302)
-* **segment:** decrease icon size on ios and stretch segment buttons to fill height ([#17751](https://github.com/ionic-team/ionic/issues/17751)) ([0fa645b](https://github.com/ionic-team/ionic/commit/0fa645b)), closes [#17069](https://github.com/ionic-team/ionic/issues/17069)
-* **textarea:** reposition textarea when keyboard appears ([#18098](https://github.com/ionic-team/ionic/issues/18098)) ([3cdab10](https://github.com/ionic-team/ionic/commit/3cdab10)), closes [#17847](https://github.com/ionic-team/ionic/issues/17847)
-* **toast:** allow button-color CSS variable to be overridden ([#18133](https://github.com/ionic-team/ionic/issues/18133)) ([0c83fd3](https://github.com/ionic-team/ionic/commit/0c83fd3)), closes [#18127](https://github.com/ionic-team/ionic/issues/18127)
-
-
-### Features
-
-* **card:** add button functionality ([#17997](https://github.com/ionic-team/ionic/issues/17997)) ([669ec0d](https://github.com/ionic-team/ionic/commit/669ec0d)), closes [#17773](https://github.com/ionic-team/ionic/issues/17773)
-* **img:** add ionImgWillLoad event and emit ionImgDidLoad when image is loaded ([#18159](https://github.com/ionic-team/ionic/issues/18159)) ([38ffb98](https://github.com/ionic-team/ionic/commit/38ffb98)), closes [#17652](https://github.com/ionic-team/ionic/issues/17652) [#18161](https://github.com/ionic-team/ionic/issues/18161)
-* **item-sliding:** add open method ([#17964](https://github.com/ionic-team/ionic/issues/17964)) ([f912206](https://github.com/ionic-team/ionic/commit/f912206)), closes [#17899](https://github.com/ionic-team/ionic/issues/17899)
-* **menu-button:** add css variables for padding ([#18188](https://github.com/ionic-team/ionic/issues/18188)) ([ef98977](https://github.com/ionic-team/ionic/commit/ef98977)), closes [#18187](https://github.com/ionic-team/ionic/issues/18187)
-* **refresher:** add pullFactor property to control speed ([#16697](https://github.com/ionic-team/ionic/issues/16697)) ([9030dcc](https://github.com/ionic-team/ionic/commit/9030dcc)), closes [#15425](https://github.com/ionic-team/ionic/issues/15425)
-* **searchbar:** add disabled property ([#17935](https://github.com/ionic-team/ionic/issues/17935)) ([a5b9066](https://github.com/ionic-team/ionic/commit/a5b9066)), closes [#17921](https://github.com/ionic-team/ionic/issues/17921)
-* **textarea:** add option to expand textarea as value changes ([#16916](https://github.com/ionic-team/ionic/issues/16916)) ([cc8678a](https://github.com/ionic-team/ionic/commit/cc8678a))
-
-
-
 ## [4.3.1](https://github.com/ionic-team/ionic/compare/v4.3.0...v4.3.1) (2019-04-26)
 
 
 ### Bug Fixes
 
 * **angular:** support replaceUrl with angular <7.2 ([#18106](https://github.com/ionic-team/ionic/issues/18106)) ([eb3cbe4](https://github.com/ionic-team/ionic/commit/eb3cbe4))
-* **security:** sanitize components using innerHTML ([#18146](https://github.com/ionic-team/ionic/issues/18146)) ([b839e6f](https://github.com/ionic-team/ionic/commit/b839e6f))
+* sanitize components using innerHTML ([#18146](https://github.com/ionic-team/ionic/issues/18146)) ([b839e6f](https://github.com/ionic-team/ionic/commit/b839e6f))
 
 
 

README.md

@@ -13,7 +13,7 @@ Ionic is based on [Web Components](https://www.webcomponents.org/introduction) a
 | **Core** | [`@ionic/core`](https://www.npmjs.com/package/@ionic/core) | [![version](https://img.shields.io/npm/v/@ionic/core/latest.svg)](https://www.npmjs.com/package/@ionic/core) | [`README.md`](core/README.md)
 | **Angular** | [`@ionic/angular`](https://www.npmjs.com/package/@ionic/angular) | [![version](https://img.shields.io/npm/v/@ionic/angular/latest.svg)](https://www.npmjs.com/package/@ionic/angular) | [`README.md`](angular/README.md)
 | **Vue** | [`@ionic/vue`](https://www.npmjs.com/package/@ionic/vue) | [![version](https://img.shields.io/npm/v/@ionic/vue/latest.svg)](https://www.npmjs.com/package/@ionic/vue) | [`README.md`](vue/README.md)
-| **React** | [`@ionic/react`](https://www.npmjs.com/package/@ionic/react) | [![version](https://img.shields.io/npm/v/@ionic/react/latest.svg)](https://www.npmjs.com/package/@ionic/react) | [`README.md`](packages/react/README.md)
+| **React** | [`@ionic/react`](https://www.npmjs.com/package/@ionic/react) | [![version](https://img.shields.io/npm/v/@ionic/react/latest.svg)](https://www.npmjs.com/package/@ionic/react) | [`README.md`](react/README.md)
 
 Looking for the `ionic-angular` package? Ionic 3 has been moved to the [`ionic-v3`](https://github.com/ionic-team/ionic-v3) repo. See [Earlier Versions](#earlier-versions).
 

angular/BREAKING.md

@@ -62,7 +62,7 @@ A list of the breaking changes introduced to each component in Ionic Angular v4.
 
 ## Action Sheet
 
-The `title`, `subTitle` and `enableBackdropDismiss` properties have been renamed to `header`, `subHeader` and `backdropDismiss` respectively.
+The `title`, `subTitle` and `enableBackdropDismiss` properties has been renamed to `header`, `subHeader` and `backdropDismiss` respectively.
 
 **Old Usage Example:**
 
@@ -89,7 +89,7 @@ await actionSheet.present();
 
 ## Alert
 
-The `title`, `subTitle` and `enableBackdropDismiss` properties have been renamed to `header`, `subHeader` and `backdropDismiss` respectively.
+The `title`, `subTitle` and `enableBackdropDismiss` properties has been renamed to `header`, `subHeader` and `backdropDismiss` respectively.
 
 **Old Usage Example:**
 
@@ -498,7 +498,7 @@ The `<ion-fab>` container was previously placed inside of the fixed content by d
 
 ### Markup Changed
 
-The Grid has been refactored in order to support CSS variables and a dynamic number of columns. The following column attributes have been changed.
+The Grid has been refactored in order to support css variables and a dynamic number of columns. The following column attributes have been changed.
 
 _In the following examples, `{breakpoint}` refers to the optional screen breakpoint (xs, sm, md, lg, xl) and `{value}` refers to the number of columns (`auto` or a number between `1` and `12`)._
 
@@ -507,7 +507,7 @@ _In the following examples, `{breakpoint}` refers to the optional screen breakpo
 - `push-{breakpoint}-{value}` attributes have been renamed to `push-{breakpoint}=“{value}”`
 - `pull-{breakpoint}-{value}` attributes have been renamed to `pull-{breakpoint}=“{value}”`
 
-Customizing the padding and width of a grid should now be done with CSS variables. For more information, see [Grid Layout](https://github.com/ionic-team/ionic-docs/blob/master/src/content/layout/grid.md).
+Customizing the padding and width of a grid should now be done with css variables. For more information, see [Grid Layout](https://github.com/ionic-team/ionic-docs/blob/master/src/content/layout/grid.md).
 
 ## Icon
 
@@ -783,26 +783,6 @@ The option component should now be written as an `ion-item-option`. Previously i
 
 The `getSlidingPercent` method has been renamed to `getSlidingRatio` since the function is returning a ratio of the open amount of the item compared to the width of the options.
 
-### Arguments Changed
-
-The `ionDrag` event no longer gets the sliding item as an argument. It now takes an event with a property `details` which contains two properties `amount` and `ratio` reflecting the absolute and ratio values of the sliding action respectively.
-
-**Old Usage Example:**
-
-```typescript
-dragged(item: ItemSliding) {
-  console.log(item.getSlidingPercent());
-  console.log(item.getOpenAmount());
-}
-```
-
-**New Usage Example:**
-```typescript
-dragged(ev: { details: { amount: number, ratio: number } }) {
-  console.log(ev.details.ratio);
-  console.log(ev.details.amount);
-}
-```
 
 ## Label
 
@@ -1092,7 +1072,7 @@ openLoading() {
 ```javascript
 async openLoading() {
   let loading = this.loadingCtrl.create({
-    message: 'Loading...'
+    content: 'Loading...'
   });
 
   await loading.present();
@@ -1798,7 +1778,7 @@ To include the stylesheet for testing such as in a Plunker, Codepen, or anywhere
 
 #### Production
 
-To use the CSS in production, we recommend importing it into a global file, such as `app/global.scss`:
+To use the css in production, we recommend importing it into a global file, such as `app/global.scss`:
 
 ```css
 /** Basic CSS for Ionic Apps */

angular/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "4.10.1",
+  "version": "4.3.1",
   "description": "Angular specific wrappers for @ionic/core",
   "keywords": [
     "ionic",
@@ -19,10 +19,6 @@
     "type": "git",
     "url": "https://github.com/ionic-team/ionic.git"
   },
-  "bugs": {
-    "url": "https://github.com/ionic-team/ionic/issues"
-  },
-  "homepage": "https://ionicframework.com/",
   "scripts": {
     "build": "npm run clean && npm run build.core && npm run build.ng && npm run clean-generated",
     "build.core": "node scripts/build-core.js",
@@ -42,29 +38,29 @@
     "validate": "npm i && npm run lint && npm run test && npm run build"
   },
   "module": "dist/fesm5.js",
-  "main": "dist/fesm5.cjs.js",
+  "main": "dist/fesm5.js",
   "types": "dist/core.d.ts",
   "files": [
     "dist/",
     "css/"
   ],
   "dependencies": {
-    "@ionic/core": "4.10.1",
+    "@ionic/core": "4.3.1",
     "tslib": "^1.9.3"
   },
   "peerDependencies": {
-    "@angular-devkit/core": "7.2.1 - 8",
-    "@angular-devkit/schematics": "7.2.1 - 8",
-    "@angular/core": "7.2.1 - 8",
-    "@angular/common": "7.2.1 - 8",
-    "@angular/forms": "7.2.1 - 8",
-    "@angular/router": "7.2.1 - 8",
-    "@angular/compiler": "7.2.1 - 8",
-    "@angular/compiler-cli": "7.2.1 - 8",
-    "@angular/platform-browser": "7.2.1 - 8",
-    "@angular/platform-browser-dynamic": "7.2.1 - 8",
+    "@angular-devkit/core": "^7.2.1",
+    "@angular-devkit/schematics": "^7.2.1",
+    "@angular/core": "^7.2.1",
+    "@angular/common": "^7.2.1",
+    "@angular/forms": "^7.2.1",
+    "@angular/router": "^7.2.1",
+    "@angular/compiler": "^7.2.1",
+    "@angular/compiler-cli": "^7.2.1",
+    "@angular/platform-browser": "^7.2.1",
+    "@angular/platform-browser-dynamic": "^7.2.1",
     "rxjs": ">=6.2.0",
-    "zone.js": ">=0.8.26"
+    "zone.js": "^0.8.26"
   },
   "devDependencies": {
     "@angular-devkit/core": "^7.2.1",
@@ -77,17 +73,17 @@
     "@angular/platform-browser": "^7.2.1",
     "@angular/platform-browser-dynamic": "^7.2.1",
     "@angular/router": "^7.2.1",
-    "@types/node": "~12.0.12",
+    "@types/node": "~10.12.0",
     "fs-extra": "^7.0.0",
-    "glob": "^7.1.4",
-    "rollup": "~1.17.0",
-    "rollup-plugin-node-resolve": "~5.2.0",
-    "rxjs": "^6.5.2",
+    "glob": "^7.1.3",
+    "rollup": "^1.1.2",
+    "rollup-plugin-node-resolve": "^4.0.0",
+    "rxjs": "^6.2.0",
     "tsickle": "^0.34.0",
     "tslint": "^5.12.1",
     "tslint-ionic-rules": "0.0.21",
-    "typescript": "~3.2.2",
-    "zone.js": "~0.8.26"
+    "typescript": "3.2.4",
+    "zone.js": "^0.8.28"
   },
   "schematics": "./dist/schematics/collection.json"
 }

angular/scripts/README.md

@@ -15,7 +15,3 @@
     npm run build.link ../ionic-conference-app
 
 When the command above is ran from the `angular` directory, it will build `@ionic/angular` and copy the `dist` directory to the correct location of another local project. In the example above, the end result is that it copies the `dist` directory to `../ionic-conference-app/node_modules/@ionic/angular/dist`. The path given should be relative to the root of this mono repo.
-
-## package.json note
-
-The `package.json` file in this directory references __Ionic 3__ and is in here to get GitHub to properly show the Used By counts on the repo. __Do not remove it!__

angular/scripts/clean.js

@@ -1,12 +1,12 @@
 const fs = require('fs-extra');
 const path = require('path');
 
-const ROOT_DIR = path.join(__dirname, '..');
 
 const cleanDirs = [
-  path.join(ROOT_DIR, 'dist')
+  'dist'
 ];
 
 cleanDirs.forEach(dir => {
-  fs.emptyDirSync(dir);
+  const cleanDir = path.join(__dirname, '../', dir);
+  fs.removeSync(cleanDir);
 });

angular/scripts/package.json

@@ -1,16 +0,0 @@
-{
-  "name": "ionic-angular",
-  "version": "`gulp package` generates dist/package.json from this template using the root ./package.json",
-  "description": "",
-  "keywords": [],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/ionic-team/ionic.git"
-  },
-  "license": "MIT",
-  "main": "umd/index.js",
-  "module": "index.js",
-  "es2015": "es2015/index.js",
-  "peerDependencies": {
-  }
-}

angular/scripts/rollup.config.js

@@ -2,13 +2,15 @@ import resolve from 'rollup-plugin-node-resolve';
 
 export default {
   input: 'build/es2015/core.js',
-  output: [
-    {
-      file: 'dist/fesm2015.js',
-      format: 'es'
-    }
-  ],
+  output: {
+    file: 'dist/fesm2015.js',
+    format: 'es'
+  },
   external: (id) => {
+    // inline @ionic/core deps
+    if (id === '@ionic/core') {
+      return false;
+    }
     // anything else is external
     // Windows: C:\xxxxxx\xxx
     const colonPosition = 1;

angular/scripts/rollup.config.legacy.js

@@ -4,15 +4,6 @@ const newConfig = {
   ...config,
   input: 'build/es5/core.js',
 };
-newConfig.output = [
-  {
-    file: 'dist/fesm5.js',
-    format: 'es'
-  },
-  {
-    file: 'dist/fesm5.cjs.js',
-    format: 'cjs'
-  }
-];
+newConfig.output.file = 'dist/fesm5.js';
 
 export { newConfig as default };

angular/src/app-initialize.ts

@@ -1,45 +1,55 @@
-import { NgZone } from '@angular/core';
-import { applyPolyfills, defineCustomElements } from '@ionic/core/loader';
+import { defineCustomElements } from '@ionic/core/loader';
 
 import { Config } from './providers/config';
 import { IonicWindow } from './types/interfaces';
-import { raf } from './util/util';
 
-let didInitialize = false;
-
-export const appInitialize = (config: Config, doc: Document, zone: NgZone) => {
+export function appInitialize(config: Config, doc: Document) {
   return (): any => {
     const win: IonicWindow | undefined = doc.defaultView as any;
     if (win) {
-      if (didInitialize) {
-        console.warn('Ionic Angular was already initialized. Make sure IonicModule.forRoot() is just called once.');
-      }
-      didInitialize = true;
       const Ionic = win.Ionic = win.Ionic || {};
 
-      Ionic.config = {
-        ...config,
-        _zoneGate: (h: any) => zone.run(h)
+      Ionic.config = config;
+      Ionic.asyncQueue = false;
+
+      Ionic.ael = (elm, eventName, cb, opts) => {
+        if (elm.__zone_symbol__addEventListener && skipZone(eventName)) {
+          elm.__zone_symbol__addEventListener(eventName, cb, opts);
+        } else {
+          elm.addEventListener(eventName, cb, opts);
+        }
       };
 
-      const aelFn = '__zone_symbol__addEventListener' in (doc.body as any)
-        ? '__zone_symbol__addEventListener'
-        : 'addEventListener';
+      Ionic.rel = (elm, eventName, cb, opts) => {
+        if (elm.__zone_symbol__removeEventListener && skipZone(eventName)) {
+          elm.__zone_symbol__removeEventListener(eventName, cb, opts);
+        } else {
+          elm.removeEventListener(eventName, cb, opts);
+        }
+      };
 
-      return applyPolyfills().then(() => {
-        return defineCustomElements(win, {
-          exclude: ['ion-tabs', 'ion-tab'],
-          syncQueue: true,
-          raf,
-          jmp: (h: any) => zone.runOutsideAngular(h),
-          ael(elm, eventName, cb, opts) {
-            (elm as any)[aelFn](eventName, cb, opts);
-          },
-          rel(elm, eventName, cb, opts) {
-            elm.removeEventListener(eventName, cb, opts);
-          }
-        });
+      return defineCustomElements(win, {
+        exclude: ['ion-tabs', 'ion-tab']
       });
     }
   };
-};
+}
+
+const SKIP_ZONE = [
+  'scroll',
+  'resize',
+
+  'touchstart',
+  'touchmove',
+  'touchend',
+
+  'mousedown',
+  'mousemove',
+  'mouseup',
+
+  'ionStyle',
+];
+
+function skipZone(eventName: string) {
+  return SKIP_ZONE.indexOf(eventName) >= 0;
+}

angular/src/directives/control-value-accessors/boolean-value-accessor.ts

@@ -25,8 +25,8 @@ export class BooleanValueAccessor extends ValueAccessor {
     setIonicClasses(this.el);
   }
 
-  @HostListener('ionChange', ['$event.target'])
-  _handleIonChange(el: any) {
-    this.handleChangeEvent(el, el.checked);
+  @HostListener('ionChange', ['$event.target.checked'])
+  _handleIonChange(value: any) {
+    this.handleChangeEvent(value);
   }
 }

angular/src/directives/control-value-accessors/numeric-value-accesssor.ts

@@ -20,9 +20,9 @@ export class NumericValueAccessor extends ValueAccessor {
     super(el);
   }
 
-  @HostListener('ionChange', ['$event.target'])
-  _handleIonChange(el: any) {
-    this.handleChangeEvent(el, el.value);
+  @HostListener('ionChange', ['$event.target.value'])
+  _handleIonChange(value: any) {
+    this.handleChangeEvent(value);
   }
 
   registerOnChange(fn: (_: number | null) => void) {

angular/src/directives/control-value-accessors/radio-value-accessor.ts

@@ -20,8 +20,8 @@ export class RadioValueAccessor extends ValueAccessor {
     super(el);
   }
 
-  @HostListener('ionSelect', ['$event.target'])
-  _handleIonSelect(el: any) {
-    this.handleChangeEvent(el, el.checked);
+  @HostListener('ionSelect', ['$event.target.checked'])
+  _handleIonSelect(value: any) {
+    this.handleChangeEvent(value);
   }
 }

angular/src/directives/control-value-accessors/select-value-accessor.ts

@@ -20,8 +20,8 @@ export class SelectValueAccessor extends ValueAccessor {
     super(el);
   }
 
-  @HostListener('ionChange', ['$event.target'])
-  _handleChangeEvent(el: any) {
-    this.handleChangeEvent(el, el.value);
+  @HostListener('ionChange', ['$event.target.value'])
+  _handleChangeEvent(value: any) {
+    this.handleChangeEvent(value);
   }
 }

angular/src/directives/control-value-accessors/text-value-accessor.ts

@@ -20,8 +20,8 @@ export class TextValueAccessor extends ValueAccessor {
     super(el);
   }
 
-  @HostListener('ionChange', ['$event.target'])
-  _handleInputEvent(el: any) {
-    this.handleChangeEvent(el, el.value);
+  @HostListener('ionChange', ['$event.target.value'])
+  _handleInputEvent(value: any) {
+    this.handleChangeEvent(value);
   }
 }

angular/src/directives/control-value-accessors/value-accessor.ts

@@ -1,8 +1,6 @@
 import { ElementRef, HostListener } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 
-import { raf } from '../../util/util';
-
 export class ValueAccessor implements ControlValueAccessor {
 
   private onChange: (value: any) => void = () => {/**/};
@@ -16,22 +14,18 @@ export class ValueAccessor implements ControlValueAccessor {
     setIonicClasses(this.el);
   }
 
-  handleChangeEvent(el: HTMLElement, value: any) {
-    if (el === this.el.nativeElement) {
-      if (value !== this.lastValue) {
-        this.lastValue = value;
-        this.onChange(value);
-      }
-      setIonicClasses(this.el);
+  handleChangeEvent(value: any) {
+    if (value !== this.lastValue) {
+      this.lastValue = value;
+      this.onChange(value);
     }
+    setIonicClasses(this.el);
   }
 
-  @HostListener('ionBlur', ['$event.target'])
-  _handleBlurEvent(el: any) {
-    if (el === this.el.nativeElement) {
-      this.onTouched();
-      setIonicClasses(this.el);
-    }
+  @HostListener('ionBlur')
+  _handleBlurEvent() {
+    this.onTouched();
+    setIonicClasses(this.el);
   }
 
   registerOnChange(fn: (value: any) => void) {
@@ -47,8 +41,8 @@ export class ValueAccessor implements ControlValueAccessor {
   }
 }
 
-export const setIonicClasses = (element: ElementRef) => {
-  raf(() => {
+export function setIonicClasses(element: ElementRef) {
+  requestAnimationFrame(() => {
     const input = element.nativeElement as HTMLElement;
     const classes = getClasses(input);
     setClasses(input, classes);
@@ -58,9 +52,9 @@ export const setIonicClasses = (element: ElementRef) => {
       setClasses(item, classes);
     }
   });
-};
+}
 
-const getClasses = (element: HTMLElement) => {
+function getClasses(element: HTMLElement) {
   const classList = element.classList;
   const classes = [];
   for (let i = 0; i < classList.length; i++) {
@@ -70,22 +64,22 @@ const getClasses = (element: HTMLElement) => {
     }
   }
   return classes;
-};
+}
 
-const setClasses = (element: HTMLElement, classes: string[]) => {
+function setClasses(element: HTMLElement, classes: string[]) {
   const classList = element.classList;
-  [
+
+  classList.remove(
     'ion-valid',
     'ion-invalid',
     'ion-touched',
     'ion-untouched',
     'ion-dirty',
     'ion-pristine'
-  ].forEach(c => classList.remove(c));
+  );
+  classList.add(...classes);
+}
 
-  classes.forEach(c => classList.add(c));
-};
-
-const startsWith = (input: string, search: string): boolean => {
+function startsWith(input: string, search: string): boolean {
   return input.substr(0, search.length) === search;
-};
+}

angular/src/directives/css-utils-deprecations.ts

@@ -1,134 +0,0 @@
-import { Directive, ElementRef } from '@angular/core';
-
-@Directive({
-  selector: '[align-self-start], [align-self-end], [align-self-center], [align-self-stretch], [align-self-baseline], [align-self-auto], [wrap-reverse], [justify-content-start], [justify-content-center], [justify-content-end], [justify-content-around], [justify-content-between], [justify-content-evenly], [align-items-start], [align-items-center], [align-items-end], [align-items-stretch], [align-items-baseline], [float-left], [float-right], [float-start], [float-end], [float-sm-left], [float-sm-right], [float-sm-start], [float-sm-end], [float-md-left], [float-md-right], [float-md-start], [float-md-end], [float-lg-left], [float-lg-right], [float-lg-start], [float-lg-end], [float-xl-left], [float-xl-right], [float-xl-start], [float-xl-end], [text-center], [text-justify], [text-start], [text-end], [text-left], [text-right], [text-nowrap], [text-wrap], [text-sm-center], [text-sm-justify], [text-sm-start], [text-sm-end], [text-sm-left], [text-sm-right], [text-sm-nowrap], [text-sm-wrap], [text-md-center], [text-md-justify], [text-md-start], [text-md-end], [text-md-left], [text-md-right], [text-md-nowrap], [text-md-wrap], [text-lg-center], [text-lg-justify], [text-lg-start], [text-lg-end], [text-lg-left], [text-lg-right], [text-lg-nowrap], [text-lg-wrap], [text-xl-center], [text-xl-justify], [text-xl-start], [text-xl-end], [text-xl-left], [text-xl-right], [text-xl-nowrap], [text-xl-wrap], [text-uppercase], [text-lowercase], [text-capitalize], [text-sm-uppercase], [text-sm-lowercase], [text-sm-capitalize], [text-md-uppercase], [text-md-lowercase], [text-md-capitalize], [text-lg-uppercase], [text-lg-lowercase], [text-lg-capitalize], [text-xl-uppercase], [text-xl-lowercase], [text-xl-capitalize], [no-padding], [padding], [padding-top], [padding-bottom], [padding-start], [padding-end], [padding-vertical], [padding-horizontal], [no-margin], [margin], [margin-top], [margin-bottom], [margin-start], [margin-end], [margin-vertical], [margin-horizontal]',
-})
-export class CssUtilsDeprecations {
-  constructor(ref: ElementRef) {
-    const el = (ref.nativeElement as HTMLElement);
-    const attributes = Array.from(el.attributes)
-      .map(a => a.name)
-      .filter(n => DEPRECATED_ATTRIBUTES.includes(n));
-
-    if (attributes.length > 0) {
-      console.warn(`[DEPRECATED][CSS] Ionic CSS attributes are deprecated.
-Replace:
-'<${el.tagName.toLowerCase()} ${attributes.map(n => `${n}`).join(' ')}>'
-
-With:
-'<${el.tagName.toLowerCase()} class="${attributes.map(n => `ion-${n}`).join(' ')}">'
-      `);
-    }
-  }
-}
-const DEPRECATED_ATTRIBUTES = [
-  'align-self-start',
-  'align-self-end',
-  'align-self-center',
-  'align-self-stretch',
-  'align-self-baseline',
-  'align-self-auto',
-  'wrap-reverse',
-  'justify-content-start',
-  'justify-content-center',
-  'justify-content-end',
-  'justify-content-around',
-  'justify-content-between',
-  'justify-content-evenly',
-  'align-items-start',
-  'align-items-center',
-  'align-items-end',
-  'align-items-stretch',
-  'align-items-baseline',
-  'float-left',
-  'float-right',
-  'float-start',
-  'float-end',
-  'float-sm-left',
-  'float-sm-right',
-  'float-sm-start',
-  'float-sm-end',
-  'float-md-left',
-  'float-md-right',
-  'float-md-start',
-  'float-md-end',
-  'float-lg-left',
-  'float-lg-right',
-  'float-lg-start',
-  'float-lg-end',
-  'float-xl-left',
-  'float-xl-right',
-  'float-xl-start',
-  'float-xl-end',
-  'text-center',
-  'text-justify',
-  'text-start',
-  'text-end',
-  'text-left',
-  'text-right',
-  'text-nowrap',
-  'text-wrap',
-  'text-sm-center',
-  'text-sm-justify',
-  'text-sm-start',
-  'text-sm-end',
-  'text-sm-left',
-  'text-sm-right',
-  'text-sm-nowrap',
-  'text-sm-wrap',
-  'text-md-center',
-  'text-md-justify',
-  'text-md-start',
-  'text-md-end',
-  'text-md-left',
-  'text-md-right',
-  'text-md-nowrap',
-  'text-md-wrap',
-  'text-lg-center',
-  'text-lg-justify',
-  'text-lg-start',
-  'text-lg-end',
-  'text-lg-left',
-  'text-lg-right',
-  'text-lg-nowrap',
-  'text-lg-wrap',
-  'text-xl-center',
-  'text-xl-justify',
-  'text-xl-start',
-  'text-xl-end',
-  'text-xl-left',
-  'text-xl-right',
-  'text-xl-nowrap',
-  'text-xl-wrap',
-  'text-uppercase',
-  'text-lowercase',
-  'text-capitalize',
-  'text-sm-uppercase',
-  'text-sm-lowercase',
-  'text-sm-capitalize',
-  'text-md-uppercase',
-  'text-md-lowercase',
-  'text-md-capitalize',
-  'text-lg-uppercase',
-  'text-lg-lowercase',
-  'text-lg-capitalize',
-  'text-xl-uppercase',
-  'text-xl-lowercase',
-  'text-xl-capitalize',
-  'no-padding',
-  'padding',
-  'padding-top',
-  'padding-bottom',
-  'padding-start',
-  'padding-end',
-  'padding-vertical',
-  'padding-horizontal',
-  'no-margin',
-  'margin',
-  'margin-top',
-  'margin-bottom',
-  'margin-start',
-  'margin-end',
-  'margin-vertical',
-  'margin-horizontal'
-];

angular/src/directives/navigation/ion-router-outlet.ts

@@ -1,5 +1,4 @@
-import { Location } from '@angular/common';
-import { Attribute, ComponentFactoryResolver, ComponentRef, Directive, ElementRef, EventEmitter, Injector, NgZone, OnDestroy, OnInit, Optional, Output, SkipSelf, ViewContainerRef } from '@angular/core';
+import { Attribute, ChangeDetectorRef, ComponentFactoryResolver, ComponentRef, Directive, ElementRef, EventEmitter, Injector, NgZone, OnDestroy, OnInit, Optional, Output, SkipSelf, ViewContainerRef } from '@angular/core';
 import { ActivatedRoute, ChildrenOutletContexts, OutletContext, PRIMARY_OUTLET, Router } from '@angular/router';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { distinctUntilChanged, filter, switchMap } from 'rxjs/operators';
@@ -57,9 +56,9 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
     private resolver: ComponentFactoryResolver,
     @Attribute('name') name: string,
     @Optional() @Attribute('tabs') tabs: string,
+    private changeDetector: ChangeDetectorRef,
     private config: Config,
     private navCtrl: NavController,
-    commonLocation: Location,
     elementRef: ElementRef,
     router: Router,
     zone: NgZone,
@@ -69,7 +68,7 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
     this.nativeEl = elementRef.nativeElement;
     this.name = name || PRIMARY_OUTLET;
     this.tabsPrefix = tabs === 'true' ? getUrl(router, activatedRoute) : undefined;
-    this.stackCtrl = new StackController(this.tabsPrefix, this.nativeEl, router, navCtrl, zone, commonLocation);
+    this.stackCtrl = new StackController(this.tabsPrefix, this.nativeEl, router, navCtrl, zone);
     parentContexts.onChildOutletCreated(this.name, this as any);
   }
 
@@ -93,7 +92,7 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
     if ((this.nativeEl as any).componentOnReady) {
       this.nativeEl.componentOnReady().then(() => {
         if (this._swipeGesture === undefined) {
-          this.swipeGesture = this.config.getBoolean('swipeBackEnabled', (this.nativeEl as any).mode === 'ios');
+          this.swipeGesture = this.config.getBoolean('swipeBackEnabled', this.nativeEl.mode === 'ios');
         }
       });
     }
@@ -142,20 +141,6 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
     if (this.activated) {
       if (this.activatedView) {
         this.activatedView.savedData = new Map(this.getContext()!.children['contexts']);
-
-        /**
-         * Ensure we are saving the NavigationExtras
-         * data otherwise it will be lost
-         */
-        this.activatedView.savedExtras = {};
-        const context = this.getContext()!;
-
-        if (context.route) {
-          const contextSnapshot = context.route.snapshot;
-
-          this.activatedView.savedExtras.queryParams = contextSnapshot.queryParams;
-          this.activatedView.savedExtras.fragment = contextSnapshot.fragment;
-        }
       }
       const c = this.component;
       this.activatedView = null;
@@ -209,6 +194,8 @@ export class IonRouterOutlet implements OnDestroy, OnInit {
       // Store references to the proxy by component
       this.proxyMap.set(cmpRef.instance, activatedRouteProxy);
       this.currentActivatedRoute$.next({ component: cmpRef.instance, activatedRoute });
+
+      this.changeDetector.markForCheck();
     }
 
     this.activatedView = enteringView;

angular/src/directives/navigation/stack-controller.ts

@@ -1,4 +1,3 @@
-import { Location } from '@angular/common';
 import { ComponentRef, NgZone } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { RouterDirection } from '@ionic/core';
@@ -23,7 +22,6 @@ export class StackController {
     private router: Router,
     private navCtrl: NavController,
     private zone: NgZone,
-    private location: Location
   ) {
     this.tabsPrefix = tabsPrefix !== undefined ? toSegments(tabsPrefix) : undefined;
   }
@@ -31,7 +29,7 @@ export class StackController {
   createView(ref: ComponentRef<any>, activatedRoute: ActivatedRoute): RouteView {
     const url = getUrl(this.router, activatedRoute);
     const element = (ref && ref.location && ref.location.nativeElement) as HTMLElement;
-    const unlistenEvents = bindLifecycleEvents(this.zone, ref.instance, element);
+    const unlistenEvents = bindLifecycleEvents(ref.instance, element);
     return {
       id: this.nextId++,
       stackId: computeStackId(this.tabsPrefix, url),
@@ -59,7 +57,6 @@ export class StackController {
       direction = 'back';
       animation = undefined;
     }
-
     const viewsSnapshot = this.views.slice();
 
     let currentNavigation;
@@ -95,36 +92,16 @@ export class StackController {
       }
     }
 
-    const reused = this.views.includes(enteringView);
     const views = this.insertView(enteringView, direction);
-
-    // Trigger change detection before transition starts
-    // This will call ngOnInit() the first time too, just after the view
-    // was attached to the dom, but BEFORE the transition starts
-    if (!reused) {
-      enteringView.ref.changeDetectorRef.detectChanges();
-    }
-
-    // Wait until previous transitions finish
-    return this.zone.runOutsideAngular(() => {
-      return this.wait(() => {
-        // disconnect leaving page from change detection to
-        // reduce jank during the page transition
-        if (leavingView) {
-          leavingView.ref.changeDetectorRef.detach();
-        }
-        // In case the enteringView is the same as the leavingPage we need to reattach()
-        enteringView.ref.changeDetectorRef.reattach();
-
-        return this.transition(enteringView, leavingView, animation, this.canGoBack(1), false)
-          .then(() => cleanupAsync(enteringView, views, viewsSnapshot, this.location))
-          .then(() => ({
-            enteringView,
-            direction,
-            animation,
-            tabSwitch
-          }));
-      });
+    return this.wait(async () => {
+      await this.transition(enteringView, leavingView, animation, this.canGoBack(1), false);
+      await cleanupAsync(enteringView, views, viewsSnapshot);
+      return {
+        enteringView,
+        direction,
+        animation,
+        tabSwitch
+      };
     });
   }
 
@@ -155,34 +132,32 @@ export class StackController {
         }
       }
 
-      return this.navCtrl.navigateBack(url, view.savedExtras).then(() => true);
+      return this.navCtrl.navigateBack(url).then(() => true);
     });
   }
 
-  startBackTransition() {
+  async startBackTransition() {
     const leavingView = this.activeView;
     if (leavingView) {
       const views = this.getStack(leavingView.stackId);
       const enteringView = views[views.length - 2];
-      return this.wait(() => {
+      enteringView.ref.changeDetectorRef.reattach();
+      await this.wait(() => {
         return this.transition(
           enteringView, // entering view
           leavingView, // leaving view
           'back',
-          this.canGoBack(2),
+          true,
           true
         );
       });
     }
-    return Promise.resolve();
   }
 
   endBackTransition(shouldComplete: boolean) {
     if (shouldComplete) {
       this.skipTransition = true;
       this.pop(1);
-    } else if (this.activeView) {
-      cleanup(this.activeView, this.views, this.views, this.location);
     }
   }
 
@@ -212,7 +187,7 @@ export class StackController {
     return this.views.slice();
   }
 
-  private transition(
+  private async transition(
     enteringView: RouteView | undefined,
     leavingView: RouteView | undefined,
     direction: 'forward' | 'back' | undefined,
@@ -221,32 +196,26 @@ export class StackController {
   ) {
     if (this.skipTransition) {
       this.skipTransition = false;
-      return Promise.resolve(false);
-    }
-    if (leavingView === enteringView) {
-      return Promise.resolve(false);
+      return;
     }
     const enteringEl = enteringView ? enteringView.element : undefined;
     const leavingEl = leavingView ? leavingView.element : undefined;
     const containerEl = this.containerEl;
     if (enteringEl && enteringEl !== leavingEl) {
-      enteringEl.classList.add('ion-page');
-      enteringEl.classList.add('ion-page-invisible');
+      enteringEl.classList.add('ion-page', 'ion-page-invisible');
       if (enteringEl.parentElement !== containerEl) {
         containerEl.appendChild(enteringEl);
       }
 
-      if ((containerEl as any).commit) {
-        return containerEl.commit(enteringEl, leavingEl, {
-          deepWait: true,
-          duration: direction === undefined ? 0 : undefined,
-          direction,
-          showGoBack,
-          progressAnimation
-        });
-      }
+      await containerEl.componentOnReady();
+      await containerEl.commit(enteringEl, leavingEl, {
+        deepWait: true,
+        duration: direction === undefined ? 0 : undefined,
+        direction,
+        showGoBack,
+        progressAnimation
+      });
     }
-    return Promise.resolve(false);
   }
 
   private async wait<T>(task: () => Promise<T>): Promise<T> {
@@ -259,41 +228,26 @@ export class StackController {
   }
 }
 
-const cleanupAsync = (activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) => {
-  if (typeof (requestAnimationFrame as any) === 'function') {
-    return new Promise<any>(resolve => {
-      requestAnimationFrame(() => {
-        cleanup(activeRoute, views, viewsSnapshot, location);
-        resolve();
-      });
+function cleanupAsync(activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[]) {
+  return new Promise(resolve => {
+    requestAnimationFrame(() => {
+      cleanup(activeRoute, views, viewsSnapshot);
+      resolve();
     });
-  }
-  return Promise.resolve();
-};
+  });
+}
 
-const cleanup = (activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) => {
+function cleanup(activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[]) {
   viewsSnapshot
     .filter(view => !views.includes(view))
     .forEach(destroyView);
 
   views.forEach(view => {
-    /**
-     * In the event that a user navigated multiple
-     * times in rapid succession, we want to make sure
-     * we don't pre-emptively detach a view while
-     * it is in mid-transition.
-     *
-     * In this instance we also do not care about query
-     * params or fragments as it will be the same view regardless
-     */
-    const locationWithoutParams = location.path().split('?')[0];
-    const locationWithoutFragment = locationWithoutParams.split('#')[0];
-
-    if (view !== activeRoute && view.url !== locationWithoutFragment) {
+    if (view !== activeRoute) {
       const element = view.element;
       element.setAttribute('aria-hidden', 'true');
       element.classList.add('ion-page-hidden');
       view.ref.changeDetectorRef.detach();
     }
   });
-};
+}

angular/src/directives/navigation/stack-utils.ts

@@ -1,8 +1,8 @@
 import { ComponentRef } from '@angular/core';
-import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { NavDirection, RouterDirection } from '@ionic/core';
 
-export const insertView = (views: RouteView[], view: RouteView, direction: RouterDirection) => {
+export function insertView(views: RouteView[], view: RouteView, direction: RouterDirection) {
   if (direction === 'root') {
     return setRoot(views, view);
   } else if (direction === 'forward') {
@@ -10,15 +10,15 @@ export const insertView = (views: RouteView[], view: RouteView, direction: Route
   } else {
     return setBack(views, view);
   }
-};
+}
 
-const setRoot = (views: RouteView[], view: RouteView) => {
+function setRoot(views: RouteView[], view: RouteView) {
   views = views.filter(v => v.stackId !== view.stackId);
   views.push(view);
   return views;
-};
+}
 
-const setForward = (views: RouteView[], view: RouteView) => {
+function setForward(views: RouteView[], view: RouteView) {
   const index = views.indexOf(view);
   if (index >= 0) {
     views = views.filter(v => v.stackId !== view.stackId || v.id <= view.id);
@@ -26,30 +26,30 @@ const setForward = (views: RouteView[], view: RouteView) => {
     views.push(view);
   }
   return views;
-};
+}
 
-const setBack = (views: RouteView[], view: RouteView) => {
+function setBack(views: RouteView[], view: RouteView) {
   const index = views.indexOf(view);
   if (index >= 0) {
     return views.filter(v => v.stackId !== view.stackId || v.id <= view.id);
   } else {
     return setRoot(views, view);
   }
-};
+}
 
-export const getUrl = (router: Router, activatedRoute: ActivatedRoute) => {
+export function getUrl(router: Router, activatedRoute: ActivatedRoute) {
   const urlTree = router.createUrlTree(['.'], { relativeTo: activatedRoute });
   return router.serializeUrl(urlTree);
-};
+}
 
-export const isTabSwitch = (enteringView: RouteView, leavingView: RouteView | undefined) => {
+export function isTabSwitch(enteringView: RouteView, leavingView: RouteView | undefined) {
   if (!leavingView) {
     return true;
   }
   return enteringView.stackId !== leavingView.stackId;
-};
+}
 
-export const computeStackId = (prefixUrl: string[] | undefined, url: string) => {
+export function computeStackId(prefixUrl: string[] | undefined, url: string) {
   if (!prefixUrl) {
     return undefined;
   }
@@ -63,22 +63,22 @@ export const computeStackId = (prefixUrl: string[] | undefined, url: string) =>
     }
   }
   return undefined;
-};
+}
 
-export const toSegments = (path: string) => {
+export function toSegments(path: string): string[] {
   return path
     .split('/')
     .map(s => s.trim())
     .filter(s => s !== '');
-};
+}
 
-export const destroyView = (view: RouteView | undefined) => {
+export function destroyView(view: RouteView | undefined) {
   if (view) {
     // TODO lifecycle event
     view.ref.destroy();
     view.unlistenEvents();
   }
-};
+}
 
 export interface StackEvent {
   enteringView: RouteView;
@@ -94,6 +94,5 @@ export interface RouteView {
   element: HTMLElement;
   ref: ComponentRef<any>;
   savedData?: any;
-  savedExtras?: NavigationExtras;
   unlistenEvents: () => void;
 }

angular/src/directives/proxies-list.txt

@@ -43,7 +43,6 @@ d.IonApp,
   d.IonMenuButton,
   d.IonMenuToggle,
   d.IonNav,
-  d.IonNavLink,
   d.IonNavPop,
   d.IonNavPush,
   d.IonNavSetRoot,

angular/src/directives/proxies-utils.ts

@@ -1,28 +1,26 @@
 /* tslint:disable */
 import { fromEvent } from 'rxjs';
 
-export const proxyInputs = (Cmp: any, inputs: string[]) => {
+export function proxyInputs(Cmp: any, inputs: string[]) {
   const Prototype = Cmp.prototype;
   inputs.forEach(item => {
     Object.defineProperty(Prototype, item, {
       get() { return this.el[item]; },
-      set(val: any) {
-        this.z.runOutsideAngular(() => this.el[item] = val);
-      },
+      set(val: any) { this.el[item] = val; },
     });
   });
-};
+}
 
-export const proxyMethods = (Cmp: any, methods: string[]) => {
+export function proxyMethods(Cmp: any, methods: string[]) {
   const Prototype = Cmp.prototype;
   methods.forEach(methodName => {
     Prototype[methodName] = function() {
       const args = arguments;
-      return this.z.runOutsideAngular(() => this.el[methodName].apply(this.el, args));
+      return this.el.componentOnReady().then((el: any) => el[methodName].apply(el, args));
     };
   });
-};
+}
 
-export const proxyOutputs = (instance: any, el: any, events: string[]) => {
+export function proxyOutputs(instance: any, el: any, events: string[]) {
   events.forEach(eventName => instance[eventName] = fromEvent(el, eventName));
-};
+}

angular/src/directives/virtual-scroll/virtual-scroll.ts

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, ContentChild, ElementRef, EmbeddedViewRef, IterableDiffer, IterableDiffers, NgZone, SimpleChanges, TrackByFunction } from '@angular/core';
-import { Cell, CellType, FooterHeightFn, HeaderFn, HeaderHeightFn, ItemHeightFn } from '@ionic/core';
+import { Cell, CellType, HeaderFn, ItemHeightFn } from '@ionic/core';
 
 import { proxyInputs, proxyMethods } from '../proxies-utils';
 
@@ -75,7 +75,7 @@ export declare interface IonVirtualScroll {
 
   /**
    * An optional function that maps each item within their height.
-   * When this function is provided, heavy optimizations and fast path can be taked by
+   * When this function is provides, heavy optimizations and fast path can be taked by
    * `ion-virtual-scroll` leading to massive performance improvements.
    *
    * This function allows to skip all DOM reads, which can be Doing so leads
@@ -83,16 +83,6 @@ export declare interface IonVirtualScroll {
    */
   itemHeight?: ItemHeightFn;
 
-  /**
-   * An optional function that maps each item header within their height.
-   */
-  headerHeight?: HeaderHeightFn;
-
-  /**
-   * An optional function that maps each item footer within their height.
-   */
-  footerHeight?: FooterHeightFn;
-
   /**
    * Same as `ngForTrackBy` which can be used on `ngFor`.
    */
@@ -124,8 +114,6 @@ export declare interface IonVirtualScroll {
     'footerFn',
     'items',
     'itemHeight',
-    'headerHeight',
-    'footerHeight',
     'trackBy'
   ]
 })
@@ -140,7 +128,7 @@ export class IonVirtualScroll {
   @ContentChild(VirtualFooter) ftrTmp!: VirtualFooter;
 
   constructor(
-    private z: NgZone,
+    private zone: NgZone,
     private iterableDiffers: IterableDiffers,
     elementRef: ElementRef,
   ) {
@@ -174,7 +162,7 @@ export class IonVirtualScroll {
   }
 
   private nodeRender(el: HTMLElement | null, cell: Cell, index: number): HTMLElement {
-    return this.z.run(() => {
+    return this.zone.run(() => {
       let node: EmbeddedViewRef<VirtualContext>;
       if (!el) {
         node = this.itmTmp.viewContainer.createEmbeddedView(
@@ -206,7 +194,7 @@ export class IonVirtualScroll {
   }
 }
 
-const getElement = (view: EmbeddedViewRef<VirtualContext>): HTMLElement => {
+function getElement(view: EmbeddedViewRef<VirtualContext>): HTMLElement {
   const rootNodes = view.rootNodes;
   for (let i = 0; i < rootNodes.length; i++) {
     if (rootNodes[i].nodeType === 1) {
@@ -214,7 +202,7 @@ const getElement = (view: EmbeddedViewRef<VirtualContext>): HTMLElement => {
     }
   }
   throw new Error('virtual element was not created');
-};
+}
 
 proxyInputs(IonVirtualScroll, [
   'approxItemHeight',
@@ -223,9 +211,7 @@ proxyInputs(IonVirtualScroll, [
   'headerFn',
   'footerFn',
   'items',
-  'itemHeight',
-  'headerHeight',
-  'footerHeight'
+  'itemHeight'
 ]);
 
 proxyMethods(IonVirtualScroll, [

angular/src/index.ts

@@ -14,7 +14,6 @@ export { IonVirtualScroll } from './directives/virtual-scroll/virtual-scroll';
 export { VirtualItem } from './directives/virtual-scroll/virtual-item';
 export { VirtualHeader } from './directives/virtual-scroll/virtual-header';
 export { VirtualFooter } from './directives/virtual-scroll/virtual-footer';
-export { CssUtilsDeprecations } from './directives/css-utils-deprecations';
 export * from './directives/proxies';
 
 // PROVIDERS

angular/src/ionic-module.ts

@@ -1,5 +1,5 @@
 import { CommonModule, DOCUMENT } from '@angular/common';
-import { APP_INITIALIZER, ModuleWithProviders, NgModule, NgZone } from '@angular/core';
+import { APP_INITIALIZER, ModuleWithProviders, NgModule } from '@angular/core';
 import { IonicConfig } from '@ionic/core';
 
 import { appInitialize } from './app-initialize';
@@ -8,13 +8,12 @@ import { NumericValueAccessor } from './directives/control-value-accessors/numer
 import { RadioValueAccessor } from './directives/control-value-accessors/radio-value-accessor';
 import { SelectValueAccessor } from './directives/control-value-accessors/select-value-accessor';
 import { TextValueAccessor } from './directives/control-value-accessors/text-value-accessor';
-import { CssUtilsDeprecations } from './directives/css-utils-deprecations';
 import { IonBackButtonDelegate } from './directives/navigation/ion-back-button';
 import { IonRouterOutlet } from './directives/navigation/ion-router-outlet';
 import { IonTabs } from './directives/navigation/ion-tabs';
 import { NavDelegate } from './directives/navigation/nav-delegate';
 import { RouterLinkDelegate } from './directives/navigation/router-link-delegate';
-import { IonApp, IonAvatar, IonBackButton, IonBackdrop, IonBadge, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonCol, IonContent, IonDatetime, IonFab, IonFabButton, IonFabList, IonFooter, IonGrid, IonHeader, IonIcon, IonImg, IonInfiniteScroll, IonInfiniteScrollContent, IonInput, IonItem, IonItemDivider, IonItemGroup, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList, IonListHeader, IonMenu, IonMenuButton, IonMenuToggle, IonNav, IonNavLink, IonNavPop, IonNavPush, IonNavSetRoot, IonNote, IonProgressBar, IonRadio, IonRadioGroup, IonRange, IonRefresher, IonRefresherContent, IonReorder, IonReorderGroup, IonRippleEffect, IonRow, IonSearchbar, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonSkeletonText, IonSlide, IonSlides, IonSpinner, IonSplitPane, IonTabBar, IonTabButton, IonText, IonTextarea, IonThumbnail, IonTitle, IonToggle, IonToolbar } from './directives/proxies';
+import { IonApp, IonAvatar, IonBackButton, IonBackdrop, IonBadge, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonCol, IonContent, IonDatetime, IonFab, IonFabButton, IonFabList, IonFooter, IonGrid, IonHeader, IonIcon, IonImg, IonInfiniteScroll, IonInfiniteScrollContent, IonInput, IonItem, IonItemDivider, IonItemGroup, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList, IonListHeader, IonMenu, IonMenuButton, IonMenuToggle, IonNav, IonNavPop, IonNavPush, IonNavSetRoot, IonNote, IonProgressBar, IonRadio, IonRadioGroup, IonRange, IonRefresher, IonRefresherContent, IonReorder, IonReorderGroup, IonRippleEffect, IonRow, IonSearchbar, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonSkeletonText, IonSlide, IonSlides, IonSpinner, IonSplitPane, IonTabBar, IonTabButton, IonText, IonTextarea, IonThumbnail, IonTitle, IonToggle, IonToolbar } from './directives/proxies';
 import { VirtualFooter } from './directives/virtual-scroll/virtual-footer';
 import { VirtualHeader } from './directives/virtual-scroll/virtual-header';
 import { VirtualItem } from './directives/virtual-scroll/virtual-item';
@@ -67,7 +66,6 @@ const DECLARATIONS = [
   IonMenuButton,
   IonMenuToggle,
   IonNav,
-  IonNavLink,
   IonNavPop,
   IonNavPush,
   IonNavSetRoot,
@@ -120,10 +118,7 @@ const DECLARATIONS = [
   VirtualFooter,
   VirtualHeader,
   VirtualItem,
-  IonVirtualScroll,
-
-  // Deprecations
-  CssUtilsDeprecations
+  IonVirtualScroll
 ];
 
 @NgModule({
@@ -147,8 +142,7 @@ export class IonicModule {
           multi: true,
           deps: [
             ConfigToken,
-            DOCUMENT,
-            NgZone
+            DOCUMENT
           ]
         }
       ]

angular/src/providers/action-sheet-controller.ts

@@ -1,5 +1,6 @@
-import { Injectable } from '@angular/core';
-import { ActionSheetOptions, actionSheetController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
+import { ActionSheetOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -7,7 +8,7 @@ import { OverlayBaseController } from '../util/overlay';
   providedIn: 'root',
 })
 export class ActionSheetController extends OverlayBaseController<ActionSheetOptions, HTMLIonActionSheetElement> {
-  constructor() {
-    super(actionSheetController);
+  constructor(@Inject(DOCUMENT) doc: any) {
+    super('ion-action-sheet-controller', doc);
   }
 }

angular/src/providers/alert-controller.ts

@@ -1,5 +1,6 @@
-import { Injectable } from '@angular/core';
-import { AlertOptions, alertController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
+import { AlertOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -7,7 +8,7 @@ import { OverlayBaseController } from '../util/overlay';
   providedIn: 'root',
 })
 export class AlertController extends OverlayBaseController<AlertOptions, HTMLIonAlertElement> {
-  constructor() {
-    super(alertController);
+  constructor(@Inject(DOCUMENT) doc: any) {
+    super('ion-alert-controller', doc);
   }
 }

angular/src/providers/angular-delegate.ts

@@ -34,10 +34,10 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
   ) {}
 
   attachViewToDom(container: any, component: any, params?: any, cssClasses?: string[]): Promise<any> {
-    return this.zone.run(() => {
-      return new Promise(resolve => {
+    return new Promise(resolve => {
+      this.zone.run(() => {
         const el = attachView(
-          this.zone, this.resolver, this.injector, this.location, this.appRef,
+          this.resolver, this.injector, this.location, this.appRef,
           this.elRefMap, this.elEventsMap,
           container, component, params, cssClasses
         );
@@ -47,8 +47,8 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
   }
 
   removeViewFromDom(_container: any, component: any): Promise<void> {
-    return this.zone.run(() => {
-      return new Promise(resolve => {
+    return new Promise(resolve => {
+      this.zone.run(() => {
         const componentRef = this.elRefMap.get(component);
         if (componentRef) {
           componentRef.destroy();
@@ -65,8 +65,7 @@ export class AngularFrameworkDelegate implements FrameworkDelegate {
   }
 }
 
-export const attachView = (
-  zone: NgZone,
+export function attachView(
   resolver: ComponentFactoryResolver,
   injector: Injector,
   location: ViewContainerRef | undefined,
@@ -74,7 +73,7 @@ export const attachView = (
   elRefMap: WeakMap<HTMLElement, any>,
   elEventsMap: WeakMap<HTMLElement, () => void>,
   container: any, component: any, params: any, cssClasses: string[] | undefined
-) => {
+) {
   const factory = resolver.resolveComponentFactory(component);
   const childInjector = Injector.create({
     providers: getProviders(params),
@@ -94,7 +93,7 @@ export const attachView = (
       hostElement.classList.add(clazz);
     }
   }
-  const unbindEvents = bindLifecycleEvents(zone, instance, hostElement);
+  const unbindEvents = bindLifecycleEvents(instance, hostElement);
   container.appendChild(hostElement);
 
   if (!location) {
@@ -104,7 +103,7 @@ export const attachView = (
   elRefMap.set(hostElement, componentRef);
   elEventsMap.set(hostElement, unbindEvents);
   return hostElement;
-};
+}
 
 const LIFECYCLES = [
   LIFECYCLE_WILL_ENTER,
@@ -114,22 +113,26 @@ const LIFECYCLES = [
   LIFECYCLE_WILL_UNLOAD
 ];
 
-export const bindLifecycleEvents = (zone: NgZone, instance: any, element: HTMLElement) => {
-  return zone.run(() => {
-    const unregisters = LIFECYCLES
-      .filter(eventName => typeof instance[eventName] === 'function')
-      .map(eventName => {
-        const handler = (ev: any) => instance[eventName](ev.detail);
-        element.addEventListener(eventName, handler);
-        return () => element.removeEventListener(eventName, handler);
-      });
-    return () => unregisters.forEach(fn => fn());
+export function bindLifecycleEvents(instance: any, element: HTMLElement) {
+  const unregisters = LIFECYCLES.map(eventName => {
+    const handler = (ev: any) => {
+      if (typeof instance[eventName] === 'function') {
+        instance[eventName](ev.detail);
+      }
+    };
+    element.addEventListener(eventName, handler);
+    return () => {
+      element.removeEventListener(eventName, handler);
+    };
   });
-};
+  return () => {
+    unregisters.forEach(fn => fn());
+  };
+}
 
 const NavParamsToken = new InjectionToken<any>('NavParamsToken');
 
-const getProviders = (params: {[key: string]: any}) => {
+function getProviders(params: {[key: string]: any}) {
   return [
     {
       provide: NavParamsToken, useValue: params
@@ -138,8 +141,8 @@ const getProviders = (params: {[key: string]: any}) => {
       provide: NavParams, useFactory: provideNavParamsInjectable, deps: [NavParamsToken]
     }
   ];
-};
+}
 
-const provideNavParamsInjectable = (params: {[key: string]: any}) => {
+function provideNavParamsInjectable(params: {[key: string]: any}) {
   return new NavParams(params);
-};
+}

angular/src/providers/config.ts

@@ -33,7 +33,6 @@ export class Config {
   }
 
   set(key: keyof IonicConfig, value?: any) {
-    console.warn(`[DEPRECATION][Config]: The Config.set() method is deprecated and will be removed in the next major release.`);
     const c = getConfig();
     if (c) {
       c.set(key, value);
@@ -43,12 +42,12 @@ export class Config {
 
 export const ConfigToken = new InjectionToken<any>('USERCONFIG');
 
-const getConfig = (): CoreConfig | null => {
+function getConfig(): CoreConfig | null {
   if (typeof (window as any) !== 'undefined') {
-    const Ionic = (window as any as IonicWindow).Ionic;
+    const Ionic = (window as IonicWindow).Ionic;
     if (Ionic && Ionic.config) {
       return Ionic.config;
     }
   }
   return null;
-};
+}

angular/src/providers/dom-controller.ts

@@ -22,7 +22,7 @@ export class DomController {
   }
 }
 
-const getQueue = () => {
+function getQueue() {
   const win = typeof (window as any) !== 'undefined' ? window : null as any;
 
   if (win != null) {
@@ -41,6 +41,6 @@ const getQueue = () => {
     read: (cb: any) => cb(),
     write: (cb: any) => cb()
   };
-};
+}
 
 export type RafCallback = (timeStamp?: number) => void;

angular/src/providers/events.ts

@@ -7,11 +7,6 @@ export type EventHandler = (...args: any[]) => any;
 export class Events {
   private c = new Map<string, EventHandler[]>();
 
-  constructor() {
-    console.warn(`[DEPRECATION][Events]: The Events provider is deprecated and it will be removed in the next major release.
-  - Use "Observables" for a similar pub/sub architecture: https://angular.io/guide/observables
-  - Use "Redux" for advanced state management: https://ngrx.io`);
-  }
   /**
    * Subscribe to an event topic. Events that get posted to that topic will trigger the provided handler.
    *

angular/src/providers/loading-controller.ts

@@ -1,5 +1,6 @@
-import { Injectable } from '@angular/core';
-import { LoadingOptions, loadingController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
+import { LoadingOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -7,7 +8,7 @@ import { OverlayBaseController } from '../util/overlay';
   providedIn: 'root',
 })
 export class LoadingController extends OverlayBaseController<LoadingOptions, HTMLIonLoadingElement> {
-  constructor() {
-    super(loadingController);
+  constructor(@Inject(DOCUMENT) doc: any) {
+    super('ion-loading-controller', doc);
   }
 }

angular/src/providers/menu-controller.ts

@@ -1,18 +1,24 @@
-import { Injectable } from '@angular/core';
-import { menuController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
 
+import { proxyMethod } from '../util/util';
+
+const CTRL = 'ion-menu-controller';
 @Injectable({
   providedIn: 'root',
 })
 export class MenuController {
 
+  constructor(@Inject(DOCUMENT) private doc: any) {
+  }
+
   /**
    * Programmatically open the Menu.
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return returns a promise when the menu is fully opened
    */
-  open(menuId?: string) {
-    return menuController.open(menuId);
+  open(menuId?: string): Promise<boolean> {
+    return proxyMethod(CTRL, this.doc, 'open', menuId);
   }
 
   /**
@@ -22,8 +28,8 @@ export class MenuController {
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return returns a promise when the menu is fully closed
    */
-  close(menuId?: string) {
-    return menuController.close(menuId);
+  close(menuId?: string): Promise<boolean> {
+    return proxyMethod(CTRL, this.doc, 'close', menuId);
   }
 
   /**
@@ -32,8 +38,8 @@ export class MenuController {
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return returns a promise when the menu has been toggled
    */
-  toggle(menuId?: string) {
-    return menuController.toggle(menuId);
+  toggle(menuId?: string): Promise<boolean> {
+    return proxyMethod(CTRL, this.doc, 'toggle', menuId);
   }
 
   /**
@@ -44,20 +50,8 @@ export class MenuController {
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return Returns the instance of the menu, which is useful for chaining.
    */
-  enable(shouldEnable: boolean, menuId?: string) {
-    return menuController.enable(shouldEnable, menuId);
-  }
-
-  /**
-   * Used to enable or disable the ability to swipe open the menu.
-   * @param shouldEnable  True if it should be swipe-able, false if not.
-   * @param [menuId]  Optionally get the menu by its id, or side.
-   * @return Returns the instance of the menu, which is useful for chaining.
-   * @deprecated Use swipeGesture() instead.
-   */
-  swipeEnable(shouldEnable: boolean, menuId?: string) {
-    console.warn('[DEPRECATED][ion-menu-controller] swipeEnable() is deprecated. Use MenuController.swipeGesture() instead');
-    return this.swipeGesture(shouldEnable, menuId);
+  enable(shouldEnable: boolean, menuId?: string): Promise<HTMLIonMenuElement> {
+    return proxyMethod(CTRL, this.doc, 'enable', shouldEnable, menuId);
   }
 
   /**
@@ -66,8 +60,8 @@ export class MenuController {
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return Returns the instance of the menu, which is useful for chaining.
    */
-  swipeGesture(shouldEnable: boolean, menuId?: string) {
-    return menuController.swipeGesture(shouldEnable, menuId);
+  swipeEnable(shouldEnable: boolean, menuId?: string): Promise<HTMLIonMenuElement> {
+    return proxyMethod(CTRL, this.doc, 'swipeEnable', shouldEnable, menuId);
   }
 
   /**
@@ -75,16 +69,16 @@ export class MenuController {
    * @return Returns true if the specified menu is currently open, otherwise false.
    * If the menuId is not specified, it returns true if ANY menu is currenly open.
    */
-  isOpen(menuId?: string) {
-    return menuController.isOpen(menuId);
+  isOpen(menuId?: string): Promise<boolean> {
+    return proxyMethod(CTRL, this.doc, 'isOpen', menuId);
   }
 
   /**
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return Returns true if the menu is currently enabled, otherwise false.
    */
-  isEnabled(menuId?: string) {
-    return menuController.isEnabled(menuId);
+  isEnabled(menuId?: string): Promise<boolean> {
+    return proxyMethod(CTRL, this.doc, 'isEnabled', menuId);
   }
 
   /**
@@ -96,21 +90,21 @@ export class MenuController {
    * @param [menuId]  Optionally get the menu by its id, or side.
    * @return Returns the instance of the menu if found, otherwise `null`.
    */
-  get(menuId?: string) {
-    return menuController.get(menuId);
+  get(menuId?: string): Promise<HTMLIonMenuElement> {
+    return proxyMethod(CTRL, this.doc, 'get', menuId);
   }
 
   /**
    * @return Returns the instance of the menu already opened, otherwise `null`.
    */
-  getOpen() {
-    return menuController.getOpen();
+  getOpen(): Promise<HTMLIonMenuElement> {
+    return proxyMethod(CTRL, this.doc, 'getOpen');
   }
 
   /**
    * @return Returns an array of all menu instances.
    */
-  getMenus() {
-    return menuController.getMenus();
+  getMenus(): Promise<HTMLIonMenuElement[]> {
+    return proxyMethod(CTRL, this.doc, 'getMenus');
   }
 }

angular/src/providers/modal-controller.ts

@@ -1,5 +1,6 @@
-import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
-import { ModalOptions, modalController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { ComponentFactoryResolver, Inject, Injectable, Injector } from '@angular/core';
+import { ModalOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -12,8 +13,9 @@ export class ModalController extends OverlayBaseController<ModalOptions, HTMLIon
     private angularDelegate: AngularDelegate,
     private resolver: ComponentFactoryResolver,
     private injector: Injector,
+    @Inject(DOCUMENT) doc: any
   ) {
-    super(modalController);
+    super('ion-modal-controller', doc);
   }
 
   create(opts: ModalOptions): Promise<HTMLIonModalElement> {

angular/src/providers/nav-controller.ts

@@ -1,6 +1,6 @@
 import { Location } from '@angular/common';
 import { Injectable, Optional } from '@angular/core';
-import { NavigationExtras, NavigationStart, Router, UrlSerializer, UrlTree } from '@angular/router';
+import { NavigationExtras, NavigationStart, Router, UrlTree } from '@angular/router';
 import { NavDirection, RouterDirection } from '@ionic/core';
 
 import { IonRouterOutlet } from '../directives/navigation/ion-router-outlet';
@@ -29,7 +29,6 @@ export class NavController {
   constructor(
     platform: Platform,
     private location: Location,
-    private serializer: UrlSerializer,
     @Optional() private router?: Router,
   ) {
     // Subscribe to router events to detect direction
@@ -50,12 +49,12 @@ export class NavController {
 
   /**
    * This method uses Angular's [Router](https://angular.io/api/router/Router) under the hood,
-   * it's equivalent to calling `this.router.navigateByUrl()`, but it's explicit about the **direction** of the transition.
+   * it's equivalent to call `this.router.navigateByUrl()`, but it's explicit about the **direction** of the transition.
    *
-   * Going **forward** means that a new page is going to be pushed to the stack of the outlet (ion-router-outlet),
+   * Going **forward** means that a new page it's going to be pushed to the stack of the outlet (ion-router-outlet),
    * and that it will show a "forward" animation by default.
    *
-   * Navigating forward can also be triggered in a declarative manner by using the `[routerDirection]` directive:
+   * Navigating forward can also be trigger in a declarative manner by using the `[routerDirection]` directive:
    *
    * ```html
    * <a routerLink="/path/to/page" routerDirection="forward">Link</a>
@@ -68,17 +67,17 @@ export class NavController {
 
   /**
    * This method uses Angular's [Router](https://angular.io/api/router/Router) under the hood,
-   * it's equivalent to calling:
+   * it's equivalent to call:
    *
    * ```ts
    * this.navController.setDirection('back');
    * this.router.navigateByUrl(path);
    * ```
    *
-   * Going **back** means that all the pages in the stack until the navigated page is found will be popped,
+   * Going **back** means that all the pages in the stack until the navigated page is found will be pop,
    * and that it will show a "back" animation by default.
    *
-   * Navigating back can also be triggered in a declarative manner by using the `[routerDirection]` directive:
+   * Navigating back can also be trigger in a declarative manner by using the `[routerDirection]` directive:
    *
    * ```html
    * <a routerLink="/path/to/page" routerDirection="back">Link</a>
@@ -91,7 +90,7 @@ export class NavController {
 
   /**
    * This method uses Angular's [Router](https://angular.io/api/router/Router) under the hood,
-   * it's equivalent to calling:
+   * it's equivalent to call:
    *
    * ```ts
    * this.navController.setDirection('root');
@@ -101,7 +100,7 @@ export class NavController {
    * Going **root** means that all existing pages in the stack will be removed,
    * and the navigated page will become the single page in the stack.
    *
-   * Navigating root can also be triggered in a declarative manner by using the `[routerDirection]` directive:
+   * Navigating root can also be trigger in a declarative manner by using the `[routerDirection]` directive:
    *
    * ```html
    * <a routerLink="/path/to/page" routerDirection="root">Link</a>
@@ -114,8 +113,7 @@ export class NavController {
 
   /**
    * Same as [Location](https://angular.io/api/common/Location)'s back() method.
-   * It will use the standard `window.history.back()` under the hood, but featuring a `back` animation
-   * by default.
+   * It will use the standard `window.history.back()` under the hood, but featuring a `back` animation.
    */
   back(options: AnimationOptions = { animated: true, animationDirection: 'back' }) {
     this.setDirection('back', options.animated, options.animationDirection);
@@ -123,9 +121,9 @@ export class NavController {
   }
 
   /**
-   * This methods goes back in the context of Ionic's stack navigation.
+   * This methods goes back in the context of ionic's stack navigation.
    *
-   * It recursively finds the top active `ion-router-outlet` and calls `pop()`.
+   * It recursivelly finds the top active `ion-router-outlet` and calls `pop()`.
    * This is the recommended way to go back when you are using `ion-router-outlet`.
    */
   async pop() {
@@ -141,11 +139,11 @@ export class NavController {
   }
 
   /**
-   * This methods specifies the direction of the next navigation performed by the Angular router.
+   * This methods specifies the direction of the next navigation performed by the angular router.
    *
-   * `setDirection()` does not trigger any transition, it just sets some flags to be consumed by `ion-router-outlet`.
+   * `setDirection()` does not trigger any transition, it just sets a set of flags to be consumed by `ion-router-outlet`.
    *
-   * It's recommended to use `navigateForward()`, `navigateBack()` and `navigateRoot()` instead of `setDirection()`.
+   * It's recommended to use `navigateForward()`, `navigateBack()` and `navigateBack()` instead of `setDirection()`.
    */
   setDirection(direction: RouterDirection, animated?: boolean, animationDirection?: 'forward' | 'back') {
     this.direction = direction;
@@ -186,34 +184,12 @@ export class NavController {
     if (Array.isArray(url)) {
       return this.router!.navigate(url, options);
     } else {
-
-      /**
-       * navigateByUrl ignores any properties that
-       * would change the url, so things like queryParams
-       * would be ignored unless we create a url tree
-       * More Info: https://github.com/angular/angular/issues/18798
-       */
-      const urlTree = this.serializer.parse(url.toString());
-
-      if (options.queryParams !== undefined) {
-        urlTree.queryParams = { ...options.queryParams };
-      }
-
-      if (options.fragment !== undefined) {
-        urlTree.fragment = options.fragment;
-      }
-
-      /**
-       * `navigateByUrl` will still apply `NavigationExtras` properties
-       * that do not modify the url, such as `replaceUrl` which is why
-       * `options` is passed in here.
-       */
-      return this.router!.navigateByUrl(urlTree, options);
+      return this.router!.navigateByUrl(url, options);
     }
   }
 }
 
-const getAnimation = (direction: RouterDirection, animated: boolean | undefined, animationDirection: 'forward' | 'back' | undefined): NavDirection | undefined => {
+function getAnimation(direction: RouterDirection, animated: boolean | undefined, animationDirection: 'forward' | 'back' | undefined): NavDirection | undefined {
   if (animated === false) {
     return undefined;
   }
@@ -226,7 +202,7 @@ const getAnimation = (direction: RouterDirection, animated: boolean | undefined,
     return 'forward';
   }
   return undefined;
-};
+}
 
 const DEFAULT_DIRECTION = 'auto';
 const DEFAULT_ANIMATED = undefined;

angular/src/providers/picker-controller.ts

@@ -1,5 +1,6 @@
-import { Injectable } from '@angular/core';
-import { PickerOptions, pickerController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
+import { PickerOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -7,7 +8,7 @@ import { OverlayBaseController } from '../util/overlay';
   providedIn: 'root',
 })
 export class PickerController extends OverlayBaseController<PickerOptions, HTMLIonPickerElement> {
-  constructor() {
-    super(pickerController);
+  constructor(@Inject(DOCUMENT) doc: any) {
+    super('ion-picker-controller', doc);
   }
 }

angular/src/providers/platform.ts

@@ -1,5 +1,5 @@
 import { DOCUMENT } from '@angular/common';
-import { Inject, Injectable, NgZone } from '@angular/core';
+import { Inject, Injectable } from '@angular/core';
 import { BackButtonEventDetail, Platforms, getPlatforms, isPlatform } from '@ionic/core';
 import { Subject, Subscription } from 'rxjs';
 
@@ -42,30 +42,29 @@ export class Platform {
    */
   resize = new Subject<void>();
 
-  constructor(@Inject(DOCUMENT) private doc: any, zone: NgZone) {
-    zone.run(() => {
-      this.win = doc.defaultView;
-      this.backButton.subscribeWithPriority = function(priority, callback) {
-        return this.subscribe(ev => (
-          ev.register(priority, () => zone.run(callback))
-        ));
-      };
+  constructor(@Inject(DOCUMENT) private doc: any) {
+    this.win = doc.defaultView;
 
-      proxyEvent(this.pause, doc, 'pause');
-      proxyEvent(this.resume, doc, 'resume');
-      proxyEvent(this.backButton, doc, 'ionBackButton');
-      proxyEvent(this.resize, this.win, 'resize');
+    this.backButton.subscribeWithPriority = function(priority, callback) {
+      return this.subscribe(ev => {
+        ev.register(priority, callback);
+      });
+    };
 
-      let readyResolve: (value: string) => void;
-      this._readyPromise = new Promise(res => { readyResolve = res; });
-      if (this.win && this.win['cordova']) {
-        doc.addEventListener('deviceready', () => {
-          readyResolve('cordova');
-        }, { once: true });
-      } else {
-        readyResolve!('dom');
-      }
-    });
+    proxyEvent(this.pause, doc, 'pause');
+    proxyEvent(this.resume, doc, 'resume');
+    proxyEvent(this.backButton, doc, 'ionBackButton');
+    proxyEvent(this.resize, this.win, 'resize');
+
+    let readyResolve: (value: string) => void;
+    this._readyPromise = new Promise(res => { readyResolve = res; });
+    if (this.win && this.win['cordova']) {
+      doc.addEventListener('deviceready', () => {
+        readyResolve('cordova');
+      }, { once: true });
+    } else {
+      readyResolve!('dom');
+    }
   }
 
   /**

angular/src/providers/popover-controller.ts

@@ -1,5 +1,6 @@
-import { ComponentFactoryResolver, Injectable, Injector } from '@angular/core';
-import { PopoverOptions, popoverController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { ComponentFactoryResolver, Inject, Injectable, Injector } from '@angular/core';
+import { PopoverOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -12,8 +13,9 @@ export class PopoverController extends OverlayBaseController<PopoverOptions, HTM
     private angularDelegate: AngularDelegate,
     private resolver: ComponentFactoryResolver,
     private injector: Injector,
+    @Inject(DOCUMENT) doc: any
   ) {
-    super(popoverController);
+    super('ion-popover-controller', doc);
   }
 
   create(opts: PopoverOptions): Promise<HTMLIonPopoverElement> {

angular/src/providers/toast-controller.ts

@@ -1,5 +1,6 @@
-import { Injectable } from '@angular/core';
-import { ToastOptions, toastController } from '@ionic/core';
+import { DOCUMENT } from '@angular/common';
+import { Inject, Injectable } from '@angular/core';
+import { ToastOptions } from '@ionic/core';
 
 import { OverlayBaseController } from '../util/overlay';
 
@@ -7,7 +8,7 @@ import { OverlayBaseController } from '../util/overlay';
   providedIn: 'root',
 })
 export class ToastController extends OverlayBaseController<ToastOptions, HTMLIonToastElement> {
-  constructor() {
-    super(toastController);
+  constructor(@Inject(DOCUMENT) doc: any) {
+    super('ion-toast-controller', doc);
   }
 }

angular/src/types/interfaces.ts

@@ -1,15 +1,13 @@
 
 export interface IonicGlobal {
   config?: any;
+  ael?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
+  raf?: (ts: number) => void;
+  rel?: (elm: any, eventName: string, cb: (ev: Event) => void, opts: any) => void;
   asyncQueue?: boolean;
 }
 
 export interface IonicWindow extends Window {
   Ionic: IonicGlobal;
-  __zone_symbol__requestAnimationFrame?: (ts: FrameRequestCallback) => number;
-}
-
-export interface HTMLStencilElement extends HTMLElement {
-  componentOnReady(): Promise<this>;
-  forceUpdate(): void;
+  __zone_symbol__requestAnimationFrame: (ts: number) => void;
 }

angular/src/util/ionic-router-reuse-strategy.ts

@@ -25,6 +25,9 @@ export class IonicRouteStrategy implements RouteReuseStrategy {
     if (future.routeConfig !== curr.routeConfig) {
       return false;
     }
+    if (future.component !== curr.component) {
+      return false;
+    }
 
     // checking router params
     const futureParams = future.params;

angular/src/util/overlay.ts

@@ -1,32 +1,26 @@
+import { proxyMethod } from './util';
 
-interface ControllerShape<Opts, HTMLElm> {
-  create(options: Opts): Promise<HTMLElm>;
-  dismiss(data?: any, role?: string, id?: string): Promise<boolean>;
-  getTop(): Promise<HTMLElm | undefined>;
-}
-
-export class OverlayBaseController<Opts, Overlay> implements ControllerShape<Opts, Overlay> {
-  constructor(private ctrl: ControllerShape<Opts, Overlay>) {}
+export class OverlayBaseController<Opts, Overlay> {
+  constructor(private ctrl: string, private doc: Document) {}
 
   /**
    * Creates a new overlay
    */
-  create(opts?: Opts) {
-    // TODO: next major release opts is not optional
-    return this.ctrl.create((opts || {}) as any);
+  create(opts?: Opts): Promise<Overlay> {
+    return proxyMethod(this.ctrl, this.doc, 'create', opts);
   }
 
   /**
    * When `id` is not provided, it dismisses the top overlay.
    */
-  dismiss(data?: any, role?: string, id?: string) {
-    return this.ctrl.dismiss(data, role, id);
+  dismiss(data?: any, role?: string, id?: string): Promise<void> {
+    return proxyMethod(this.ctrl, this.doc, 'dismiss', data, role, id);
   }
 
   /**
    * Returns the top overlay.
    */
-  getTop() {
-    return this.ctrl.getTop();
+  getTop(): Promise<Overlay | undefined> {
+    return proxyMethod(this.ctrl, this.doc, 'getTop');
   }
 }

angular/src/util/util.ts

@@ -1,13 +1,15 @@
 
-declare const __zone_symbol__requestAnimationFrame: any;
-declare const requestAnimationFrame: any;
+export function proxyMethod(ctrlName: string, doc: Document, methodName: string, ...args: any[]) {
+  const controller = ensureElementInBody(ctrlName, doc);
+  return controller.componentOnReady()
+    .then(() => (controller as any)[methodName].apply(controller, args));
+}
 
-export const raf = (h: any) => {
-  if (typeof __zone_symbol__requestAnimationFrame === 'function') {
-    return __zone_symbol__requestAnimationFrame(h);
+export function ensureElementInBody(elementName: string, doc: Document) {
+  let element = doc.querySelector(elementName);
+  if (!element) {
+    element = doc.createElement(elementName);
+    doc.body.appendChild(element);
   }
-  if (typeof requestAnimationFrame === 'function') {
-    return requestAnimationFrame(h);
-  }
-  return setTimeout(h);
-};
+  return element as HTMLStencilElement;
+}

angular/test/test-app/angular.json

@@ -13,25 +13,18 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "outputPath": "dist/browser",
+            "outputPath": "dist/test-app",
             "index": "src/index.html",
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",
-            "tsConfig": "tsconfig.app.json",
+            "tsConfig": "src/tsconfig.app.json",
             "assets": [
               "src/favicon.ico",
-              {
-                "glob": "**/*",
-                "input": "src/assets",
-                "output": "assets"
-              },
-              {
-                "glob": "**/*.svg",
-                "input": "node_modules/ionicons/dist/ionicons/svg",
-                "output": "./svg"
-              }
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.css"
             ],
-            "styles": ["src/styles.css"],
             "scripts": []
           },
           "configurations": {
@@ -84,13 +77,37 @@
           "options": {
             "main": "src/test.ts",
             "polyfills": "src/polyfills.ts",
-            "tsConfig": "tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "styles": ["src/styles.css"],
+            "tsConfig": "src/tsconfig.spec.json",
+            "karmaConfig": "src/karma.conf.js",
+            "styles": [
+              "src/styles.css"
+            ],
             "scripts": [],
-            "assets": ["src/favicon.ico", "src/assets"]
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ]
           }
         },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "test-app-e2e": {
+      "root": "e2e/",
+      "projectType": "application",
+      "prefix": "",
+      "architect": {
         "e2e": {
           "builder": "@angular-devkit/build-angular:protractor",
           "options": {
@@ -100,39 +117,20 @@
           "configurations": {
             "production": {
               "devServerTarget": "test-app:serve:production"
-            },
-            "ci": {
-              "devServerTarget": "test-app:serve:ci"
             }
           }
         },
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
-            "tsConfig": ["tsconfig.app.json", "tsconfig.spec.json"],
-            "exclude": ["**/node_modules/**"]
-          }
-        },
-        "server": {
-          "builder": "@angular-devkit/build-angular:server",
-          "options": {
-            "outputPath": "dist/server",
-            "main": "src/main.server.ts",
-            "tsConfig": "tsconfig.server.json"
-          },
-          "configurations": {
-            "production": {
-              "fileReplacements": [
-                {
-                  "src": "src/environments/environment.ts",
-                  "replaceWith": "src/environments/environment.prod.ts"
-                }
-              ]
-            }
+            "tsConfig": "e2e/tsconfig.e2e.json",
+            "exclude": [
+              "**/node_modules/**"
+            ]
           }
         }
       }
     }
   },
   "defaultProject": "test-app"
-}
+}

angular/test/test-app/browserslist

@@ -1,12 +0,0 @@
-# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
-# For additional information regarding the format and rule options, please see:
-# https://github.com/browserslist/browserslist#queries
-
-# You can see what browsers were selected by your queries by running:
-#   npx browserslist
-
-> 0.5%
-last 2 versions
-Firefox ESR
-not dead
-not IE 9-11 # For IE 9-11 support, remove 'not'.

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

@@ -1,22 +1,19 @@
-// @ts-check
 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 
 const { SpecReporter } = require('jasmine-spec-reporter');
 
-/**
- * @type { import("protractor").Config }
- */
 exports.config = {
   allScriptsTimeout: 11000,
   specs: [
-    './src/**/*.e2e-spec.ts'
+    './**/*.e2e-spec.ts'
   ],
   capabilities: {
-    'browserName': 'chrome'
-  },
-  chromeOptions: {
-     args: [ "--headless", "--disable-gpu", "--window-size=400,1000", "--start-maximized" ]
+    browserName: 'chrome',
+  
+    chromeOptions: {
+       args: [ "--headless", "--disable-gpu", "--window-size=400,1000", "--start-maximized" ]
+     }
   },
   directConnect: true,
   baseUrl: 'http://localhost:4200/',
@@ -28,8 +25,8 @@ exports.config = {
   },
   onPrepare() {
     require('ts-node').register({
-      project: require('path').join(__dirname, './tsconfig.json')
+      project: require('path').join(__dirname, './tsconfig.e2e.json')
     });
     jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
   }
-};
+};

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

@@ -4,13 +4,12 @@ import { handleErrorMessages, setProperty, getText, waitTime } from './utils';
 describe('form', () => {
 
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   describe('change', () => {
     beforeEach(async () => {
       await browser.get('/form');
-      await waitTime(30);
     });
 
     it('should have default values', async () => {
@@ -82,7 +81,6 @@ describe('form', () => {
   describe('blur', () => {
     beforeEach(async () => {
       await browser.get('/form#blur');
-      await waitTime(30);
     });
 
     it('ion-toggle should change only after blur', async () => {

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

@@ -1,14 +1,13 @@
 import { browser, element, by } from 'protractor';
-import { getProperty, setProperty, handleErrorMessages, waitTime } from './utils';
+import { getProperty, setProperty, handleErrorMessages } from './utils';
 
 describe('inputs', () => {
 
   beforeEach(async () => {
     await browser.get('/inputs');
-    await waitTime(30);
   });
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should have default value', async () => {
@@ -60,10 +59,4 @@ describe('inputs', () => {
     expect(await element(by.css('#select-note')).getText()).toEqual('playstation');
     expect(await element(by.css('#range-note')).getText()).toEqual('20');
   });
-
-  it('nested components should not interfere with NgModel', async () => {
-    expect(await element(by.css('#range-note')).getText()).toEqual('10');
-    await element(by.css('#nested-toggle')).click();
-    expect(await element(by.css('#range-note')).getText()).toEqual('10');
-  });
 });

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

@@ -5,10 +5,9 @@ describe('modals', () => {
 
   beforeEach(async () => {
     await browser.get('/modals');
-    await waitTime(30);
   });
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should open standalone modal and close', async () => {

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

@@ -4,44 +4,9 @@ import { handleErrorMessages, waitTime, testStack } from './utils';
 describe('navigation', () => {
 
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
-  // TODO: Fix flaky tests
-  xit ('should swipe and abort', async () => {
-    await browser.get('/router-link?ionic:mode=ios');
-    await waitTime(500);
-    await element(by.css('#routerLink')).click();
-    await waitTime(500);
-    await swipeLeft(5);
-    await waitTime(500);
-
-    const pageHidden = element(by.css('app-router-link'));
-    expect(await pageHidden.getAttribute('aria-hidden')).toEqual('true');
-    expect(await pageHidden.getAttribute('class')).toEqual('ion-page ion-page-hidden');
-
-    const pageVisible = element(by.css('app-router-link-page'));
-    expect(await pageVisible.getAttribute('aria-hidden')).toEqual(null);
-    expect(await pageVisible.getAttribute('class')).toEqual('ion-page can-go-back');
-  });
-
-  xit ('should swipe and go back', async () => {
-    await browser.get('/router-link?ionic:mode=ios');
-    await waitTime(500);
-    await element(by.css('#routerLink')).click();
-    await waitTime(500);
-    await testStack('ion-router-outlet', ['app-router-link', 'app-router-link-page']);
-
-    await swipeLeft(300);
-
-    await waitTime(1000);
-    await testStack('ion-router-outlet', ['app-router-link']);
-
-    const page = element(by.css('app-router-link'));
-    expect(await page.getAttribute('aria-hidden')).toEqual(null);
-    expect(await page.getAttribute('class')).toEqual('ion-page');
-  })
-
   it('should navigate correctly', async () => {
     await browser.get('/navigation/page1');
     await waitTime(2000);
@@ -57,17 +22,3 @@ describe('navigation', () => {
   });
 
 });
-
-function swipeLeft(end: number) {
-  return browser.driver.touchActions()
-    .tapAndHold({x: 5, y: 1})
-    .move({x: 6, y: 1})
-    .move({x: 7, y: 1})
-    .move({x: 8, y: 1})
-    .move({x: 30, y: 1})
-    .move({x: 300, y: 1})
-    .move({x: end, y: 1})
-    .move({x: end, y: 1})
-    .release({x: end, y: 1})
-    .perform();
-}

angular/test/test-app/e2e/src/nested-outlet.e2e-spec.ts

@@ -4,7 +4,7 @@ import { waitTime, handleErrorMessages, goBack } from './utils';
 describe('nested-outlet', () => {
 
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should navigate correctly', async () => {

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

@@ -4,7 +4,7 @@ import { handleErrorMessages, waitTime } from './utils';
 describe('providers', () => {
 
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should load all providers', async () => {
@@ -12,9 +12,6 @@ describe('providers', () => {
 
     expect(await element(by.css('#is-loaded')).getText()).toEqual('true');
     expect(await element(by.css('#is-ready')).getText()).toEqual('true');
-    expect(await element(by.css('#is-paused')).getText()).toEqual('true');
-    expect(await element(by.css('#is-resumed')).getText()).toEqual('true');
-    expect(await element(by.css('#is-resized')).getText()).toEqual('true');
     expect(await element(by.css('#is-testing')).getText()).toEqual('false');
     expect(await element(by.css('#is-desktop')).getText()).toEqual('true');
     expect(await element(by.css('#is-mobile')).getText()).toEqual('false');

angular/test/test-app/e2e/src/router-link.e2e-spec.ts

@@ -1,61 +1,13 @@
-import { browser, element, by, protractor } from 'protractor';
-import { waitTime, testStack, testLifeCycle, handleErrorMessages, getText } from './utils';
-
-const EC = protractor.ExpectedConditions;
-
-describe('router-link params and fragments', () => {
-  const queryParam = 'A&=#Y';
-  const fragment = 'myDiv1';
-  const id = 'MyPageID==';
-
-  afterEach(() => {
-    return handleErrorMessages();
-  });
-
-  it('should go to a page with properly encoded values', async () => {
-    await browser.get('/router-link?ionic:_testing=true');
-    await element(by.css('#queryParamsFragment')).click();
-
-    const expectedRoute = `${encodeURIComponent(id)}?token=${encodeURIComponent(queryParam)}#${encodeURIComponent(fragment)}`;
-
-    browser.wait(EC.urlContains(expectedRoute), 5000);
-  });
-
-  it('should return to a page with preserved query param and fragment', async () => {
-    await browser.get('/router-link?ionic:_testing=true');
-    await waitTime(30);
-    await element(by.css('#queryParamsFragment')).click();
-    await waitTime(400);
-    await element(by.css('#goToPage3')).click();
-
-    browser.wait(EC.urlContains('router-link-page3'), 5000);
-    await waitTime(400);
-
-    await element(by.css('#goBackFromPage3')).click();
-
-    const expectedRoute = `${encodeURIComponent(id)}?token=${encodeURIComponent(queryParam)}#${encodeURIComponent(fragment)}`;
-    browser.wait(EC.urlContains(expectedRoute), 5000);
-  });
-
-  it('should preserve query param and fragment with defaultHref string', async () => {
-    await browser.get('/router-link-page3?ionic:_testing=true');
-    await waitTime(30);
-
-    await element(by.css('#goBackFromPage3')).click();
-
-    const expectedRoute = '?token=ABC#fragment';
-    browser.wait(EC.urlContains(expectedRoute), 5000);
-  });
-});
+import { browser, element, by } from 'protractor';
+import { waitTime, testStack, testLifeCycle, handleErrorMessages } from './utils';
 
 describe('router-link', () => {
 
   beforeEach(async () => {
     await browser.get('/router-link');
-    await waitTime(30);
   });
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
 
@@ -73,6 +25,18 @@ describe('router-link', () => {
     it('should go forward with ion-button[routerLink]', async () => {
       await element(by.css('#routerLink')).click();
       await testForward();
+
+      // test go back
+      await element(by.css('ion-back-button')).click();
+      await waitTime(500);
+
+      await testStack('ion-router-outlet', ['app-router-link']);
+      await testLifeCycle('app-router-link', {
+        ionViewWillEnter: 2,
+        ionViewDidEnter: 2,
+        ionViewWillLeave: 1,
+        ionViewDidLeave: 1,
+      });
     });
 
     it('should go forward with a[routerLink]', async () => {
@@ -113,6 +77,7 @@ describe('router-link', () => {
 
     it('should go back with ion-button[routerLink][routerDirection=back]', async () => {
       await element(by.css('#routerLink-back')).click();
+      await testBack();
     });
 
     it('should go back with a[routerLink][routerDirection=back]', async () => {
@@ -128,25 +93,21 @@ describe('router-link', () => {
 });
 
 async function testForward() {
-  await waitTime(2500);
+  await waitTime(500);
   await testStack('ion-router-outlet', ['app-router-link', 'app-router-link-page']);
+  await testLifeCycle('app-router-link', {
+    ionViewWillEnter: 1,
+    ionViewDidEnter: 1,
+    ionViewWillLeave: 1,
+    ionViewDidLeave: 1,
+  });
   await testLifeCycle('app-router-link-page', {
     ionViewWillEnter: 1,
     ionViewDidEnter: 1,
     ionViewWillLeave: 0,
     ionViewDidLeave: 0,
   });
-  expect(await getText(`app-router-link-page #canGoBack`)).toEqual('true');
 
-  await browser.navigate().back();
-  await waitTime(100);
-  await testStack('ion-router-outlet', ['app-router-link']);
-  await testLifeCycle('app-router-link', {
-    ionViewWillEnter: 2,
-    ionViewDidEnter: 2,
-    ionViewWillLeave: 1,
-    ionViewDidLeave: 1,
-  });
 }
 
 async function testRoot() {
@@ -158,17 +119,6 @@ async function testRoot() {
     ionViewWillLeave: 0,
     ionViewDidLeave: 0,
   });
-  expect(await getText(`app-router-link-page #canGoBack`)).toEqual('false');
-
-  await browser.navigate().back();
-  await waitTime(100);
-  await testStack('ion-router-outlet', ['app-router-link']);
-  await testLifeCycle('app-router-link', {
-    ionViewWillEnter: 1,
-    ionViewDidEnter: 1,
-    ionViewWillLeave: 0,
-    ionViewDidLeave: 0,
-  });
 }
 
 async function testBack() {
@@ -180,15 +130,4 @@ async function testBack() {
     ionViewWillLeave: 0,
     ionViewDidLeave: 0,
   });
-  expect(await getText(`app-router-link-page #canGoBack`)).toEqual('false');
-
-  await browser.navigate().back();
-  await waitTime(100);
-  await testStack('ion-router-outlet', ['app-router-link']);
-  await testLifeCycle('app-router-link', {
-    ionViewWillEnter: 1,
-    ionViewDidEnter: 1,
-    ionViewWillLeave: 0,
-    ionViewDidLeave: 0,
-  });
 }

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

@@ -5,10 +5,9 @@ describe('slides', () => {
 
   beforeEach(async () => {
     await browser.get('/slides');
-    await waitTime(30);
   });
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should change index on slide change', async () => {

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

@@ -3,12 +3,11 @@ import { waitTime, testStack, handleErrorMessages } from './utils';
 
 describe('tabs', () => {
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
   describe('entry url - /tabs', () => {
     beforeEach(async () => {
       await browser.get('/tabs');
-      await waitTime(30);
     });
 
     it('should redirect and load tab-account', async () => {
@@ -17,19 +16,10 @@ describe('tabs', () => {
       await testState(1, 'account');
     });
 
-    it('should navigate between tabs and ionChange events should be dispatched ', async () => {
-      let tab = await testTabTitle('Tab 1 - Page 1');
-      expect(await tab.$('.segment-changed').getText()).toEqual('false');
-
-      await element(by.css('#tab-button-contact')).click();
-      tab = await testTabTitle('Tab 2 - Page 1');
-      expect(await tab.$('.segment-changed').getText()).toEqual('false');
-    });
-
     it('should simulate stack + double tab click', async () => {
       let tab = await getSelectedTab() as ElementFinder;
       await tab.$('#goto-tab1-page2').click();
-      await testTabTitle('Tab 1 - Page 2 (1)');
+      await testTabTitle('Tab 1 - Page 2');
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab1', 'app-tabs-tab1-nested']);
       await testState(1, 'account');
       expect(await tab.$('ion-back-button').isDisplayed()).toBe(true);
@@ -40,7 +30,7 @@ describe('tabs', () => {
       await testState(2, 'contact');
 
       await element(by.css('#tab-button-account')).click();
-      tab = await testTabTitle('Tab 1 - Page 2 (1)');
+      tab = await testTabTitle('Tab 1 - Page 2');
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab1', 'app-tabs-tab1-nested', 'app-tabs-tab2']);
       await testState(3, 'account');
       expect(await tab.$('ion-back-button').isDisplayed()).toBe(true);
@@ -54,7 +44,7 @@ describe('tabs', () => {
     it('should simulate stack + back button click', async () => {
       const tab = await getSelectedTab();
       await tab.$('#goto-tab1-page2').click();
-      await testTabTitle('Tab 1 - Page 2 (1)');
+      await testTabTitle('Tab 1 - Page 2');
       await testState(1, 'account');
 
       await element(by.css('#tab-button-contact')).click();
@@ -62,7 +52,7 @@ describe('tabs', () => {
       await testState(2, 'contact');
 
       await element(by.css('#tab-button-account')).click();
-      await testTabTitle('Tab 1 - Page 2 (1)');
+      await testTabTitle('Tab 1 - Page 2');
       await testState(3, 'account');
 
       await element(by.css('ion-back-button')).click();
@@ -71,33 +61,6 @@ describe('tabs', () => {
       await testState(3, 'account');
     });
 
-    it('should navigate deep then go home', async () => {
-      let tab = await getSelectedTab();
-      await tab.$('#goto-tab1-page2').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (1)');
-
-      await tab.$('#goto-next').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (2)');
-
-      await element(by.css('#tab-button-contact')).click();
-      tab = await testTabTitle('Tab 2 - Page 1');
-
-      await element(by.css('#tab-button-account')).click();
-      await testTabTitle('Tab 1 - Page 2 (2)');
-      await testStack('ion-tabs ion-router-outlet', [
-        'app-tabs-tab1',
-        'app-tabs-tab1-nested',
-        'app-tabs-tab1-nested',
-        'app-tabs-tab2'
-      ]);
-      await element(by.css('#tab-button-account')).click();
-      await testTabTitle('Tab 1 - Page 1');
-      await testStack('ion-tabs ion-router-outlet', [
-        'app-tabs-tab1',
-        'app-tabs-tab2'
-      ]);
-    });
-
     it('should switch tabs and go back', async () => {
       await element(by.css('#tab-button-contact')).click();
       const tab = await testTabTitle('Tab 2 - Page 1');
@@ -112,7 +75,7 @@ describe('tabs', () => {
       const tab = await testTabTitle('Tab 2 - Page 1');
 
       await tab.$('#goto-tab1-page2').click();
-      await testTabTitle('Tab 1 - Page 2 (1)');
+      await testTabTitle('Tab 1 - Page 2');
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab2', 'app-tabs-tab1-nested']);
     });
 
@@ -133,14 +96,13 @@ describe('tabs', () => {
     });
   });
 
-  describe('entry url - /tabs/account/nested/1', () => {
+  describe('entry url - /tabs/account/nested/12', () => {
     beforeEach(async () => {
-      await browser.get('/tabs/account/nested/1');
-      await waitTime(30);
+      await browser.get('/tabs/account/nested/12');
     });
 
     it('should only display the back-button when there is a page in the stack', async () => {
-      let tab = await testTabTitle('Tab 1 - Page 2 (1)') as ElementFinder;
+      let tab = await testTabTitle('Tab 1 - Page 2') as ElementFinder;
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab1-nested']);
       expect(await tab.$('ion-back-button').isDisplayed()).toBe(false);
 
@@ -148,38 +110,14 @@ describe('tabs', () => {
       tab = await testTabTitle('Tab 1 - Page 1');
 
       await tab.$('#goto-tab1-page2').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (1)');
+      tab = await testTabTitle('Tab 1 - Page 2');
       expect(await tab.$('ion-back-button').isDisplayed()).toBe(true);
     });
-
-    it('should not reuse the same page', async () => {
-      let tab = await testTabTitle('Tab 1 - Page 2 (1)') as ElementFinder;
-      await tab.$('#goto-next').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (2)');
-      await tab.$('#goto-next').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (3)');
-
-      await testStack('ion-tabs ion-router-outlet',[
-        'app-tabs-tab1-nested',
-        'app-tabs-tab1-nested',
-        'app-tabs-tab1-nested'
-      ]);
-
-      await tab.$('ion-back-button').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (2)');
-      await tab.$('ion-back-button').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (1)');
-
-      expect(await tab.$('ion-back-button').isDisplayed()).toBe(false);
-
-      await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab1-nested']);
-    });
   });
 
   describe('entry url - /tabs/lazy', () => {
     beforeEach(async () => {
       await browser.get('/tabs/lazy');
-      await waitTime(30);
     });
 
     it('should not display the back-button if coming from a different stack', async () => {
@@ -187,29 +125,27 @@ describe('tabs', () => {
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab3']);
 
       await tab.$('#goto-tab1-page2').click();
-      tab = await testTabTitle('Tab 1 - Page 2 (1)');
+      tab = await testTabTitle('Tab 1 - Page 2');
       await testStack('ion-tabs ion-router-outlet', ['app-tabs-tab3', 'app-tabs-tab1-nested']);
       expect(await tab.$('ion-back-button').isDisplayed()).toBe(false);
     });
   });
-
+  
   describe('enter url - /tabs/contact/one', () => {
     beforeEach(async () => {
       await browser.get('/tabs/contact/one');
-      await waitTime(30);
     });
-
-    it('should return to correct tab after going to page in different outlet', async () => {
+    
+    it('should return to correct tab after going to page in different outlet', async () => {      
       const tab = await getSelectedTab();
       await tab.$('#goto-nested-page1').click();
-
-      await waitTime(600);
+            
       await testStack('app-nested-outlet ion-router-outlet', ['app-nested-outlet-page']);
-
+      
       const nestedOutlet = await element(by.css('app-nested-outlet'));
       const backButton = await nestedOutlet.$('ion-back-button');
       await backButton.click();
-
+            
       await testTabTitle('Tab 2 - Page 1');
     });
   })
@@ -220,7 +156,7 @@ async function testState(count: number, tab: string) {
 }
 
 async function testTabTitle(title: string) {
-  await waitTime(1000);
+  await waitTime(600);
   const tab = await getSelectedTab();
   expect(await tab.$('ion-title').getText()).toEqual(title);
   return tab;

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

@@ -37,30 +37,29 @@ export interface LifeCycleCount {
 }
 
 export function handleErrorMessages() {
-  return browser.manage().logs().get('browser').then(function (browserLog) {
-    for (let i = 0; i <= browserLog.length - 1; i++) {
-      if (browserLog[i].level.name_ === 'SEVERE') {
-        fail(browserLog[i].message);
-      }
+  browser.manage().logs().get('browser').then(function(browserLog) {
+    let severWarnings = false;
+
+    for (let i; i <= browserLog.length - 1; i++) {
+        if (browserLog[i].level.name === 'SEVERE') {
+            console.log('\n' + browserLog[i].level.name);
+            console.log('(Possibly exception) \n' + browserLog[i].message);
+
+            severWarnings = true;
+        }
     }
+
+    expect(severWarnings).toBe(false);
   });
 }
 
 export async function testLifeCycle(selector: string, expected: LifeCycleCount) {
   await waitTime(50);
-  const results = await Promise.all([
-    getText(`${selector} #ngOnInit`),
-    getText(`${selector} #ionViewWillEnter`),
-    getText(`${selector} #ionViewDidEnter`),
-    getText(`${selector} #ionViewWillLeave`),
-    getText(`${selector} #ionViewDidLeave`),
-  ]);
-
-  expect(results[0]).toEqual('1');
-  expect(results[1]).toEqual(expected.ionViewWillEnter.toString());
-  expect(results[2]).toEqual(expected.ionViewDidEnter.toString());
-  expect(results[3]).toEqual(expected.ionViewWillLeave.toString());
-  expect(results[4]).toEqual(expected.ionViewDidLeave.toString());
+  expect(await getText(`${selector} #ngOnInit`)).toEqual('1');
+  expect(await getText(`${selector} #ionViewWillEnter`)).toEqual(expected.ionViewWillEnter.toString());
+  expect(await getText(`${selector} #ionViewDidEnter`)).toEqual(expected.ionViewDidEnter.toString());
+  expect(await getText(`${selector} #ionViewWillLeave`)).toEqual(expected.ionViewWillLeave.toString());
+  expect(await getText(`${selector} #ionViewDidLeave`)).toEqual(expected.ionViewDidLeave.toString());
 }
 
 export async function testStack(selector: string, expected: string[]) {

angular/test/test-app/e2e/src/view-child.e2e-spec.ts

@@ -1,14 +1,13 @@
 import { browser, element, by } from 'protractor';
-import { handleErrorMessages, waitTime } from './utils';
+import { handleErrorMessages } from './utils';
 
 describe('view-child', () => {
 
   beforeEach(async () => {
     await browser.get('/view-child');
-    await waitTime(30);
   });
   afterEach(() => {
-    return handleErrorMessages();
+    handleErrorMessages();
   });
 
   it('should get a reference to all children', async () => {

angular/test/test-app/e2e/src/virtual-scroll.e2e-spec.ts

@@ -1,18 +0,0 @@
-import { browser, element, by } from 'protractor';
-import { waitTime, handleErrorMessages } from './utils';
-
-describe('virtual-scroll', () => {
-  afterEach(() => {
-    return handleErrorMessages();
-  });
-  beforeEach(async () => {
-    await browser.get('/virtual-scroll');
-    await waitTime(30);
-  });
-
-  it('should open virtual-scroll', () => {
-    const virtualElements = element.all(by.css('ion-virtual-scroll > *'));
-    expect(virtualElements.count()).toBeGreaterThan(0);
-  });
-
-});

angular/test/test-app/package.json

@@ -1,60 +1,51 @@
 {
-  "name": "ionic-angular-test-app",
+  "name": "test-app",
   "version": "0.0.0",
-  "private": true,
   "scripts": {
     "ng": "ng",
     "start": "npm run sync && ng serve",
     "sync:build": "sh scripts/build-ionic.sh",
     "sync": "sh scripts/sync.sh",
-    "build": "npm run sync && ng build --prod --no-progress",
+    "build": "ng build --prod --no-progress",
     "test": "ng e2e --prod",
-    "test.dev": "npm run sync && ng e2e",
     "lint": "ng lint",
-    "postinstall": "npm run sync",
-    "compile:server": "webpack --config webpack.server.config.js --progress --colors",
-    "serve:ssr": "node dist/server",
-    "build:ssr": "npm run build:client-and-server-bundles && npm run compile:server",
-    "build:client-and-server-bundles": "npm run build && ng run test-app:server:production --bundleDependencies all"
+    "postinstall": "npm run sync"
   },
+  "private": true,
   "dependencies": {
-    "@angular/animations": "^8.2.8",
-    "@angular/common": "^8.2.8",
-    "@angular/compiler": "^8.2.8",
-    "@angular/core": "^8.2.8",
-    "@angular/forms": "^8.2.8",
-    "@angular/platform-browser": "^8.2.8",
-    "@angular/platform-browser-dynamic": "^8.2.8",
-    "@angular/platform-server": "^8.2.8",
-    "@angular/router": "^8.2.8",
-    "@ionic/angular": "^4.7.0",
-    "@ionic/angular-server": "^0.0.2",
-    "@nguniversal/express-engine": "~8.1.1",
-    "@nguniversal/module-map-ngfactory-loader": "~8.1.1",
+    "@angular/animations": "~7.2.1",
+    "@angular/common": "~7.2.1",
+    "@angular/compiler": "~7.2.1",
+    "@angular/core": "~7.2.1",
+    "@angular/forms": "~7.2.1",
+    "@angular/platform-browser": "~7.2.1",
+    "@angular/platform-browser-dynamic": "~7.2.1",
+    "@angular/router": "~7.2.1",
+    "@ionic/angular": "^4.0.0-rc.1",
     "core-js": "^2.6.2",
-    "express": "^4.15.2",
-    "rxjs": "^6.5.3",
+    "rxjs": "~6.3.3",
     "tslib": "^1.9.0",
-    "zone.js": "~0.9.1"
+    "zone.js": "~0.8.26"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.803.6",
-    "@angular/cli": "^8.3.6",
-    "@angular/compiler-cli": "^8.2.8",
-    "@angular/language-service": "^8.2.8",
-    "@types/jasmine": "3.4.1",
-    "@types/node": "12.7.8",
-    "codelyzer": "^5.1.2",
-    "jasmine-core": "3.5.0",
-    "jasmine-spec-reporter": "4.2.1",
-    "karma": "4.3.0",
-    "karma-chrome-launcher": "3.1.0",
-    "karma-jasmine": "2.0.1",
-    "protractor": "5.4.2",
-    "ts-loader": "^6.1.2",
-    "ts-node": "8.4.1",
-    "tslint": "~5.18.0",
-    "typescript": "~3.5.3",
-    "webpack-cli": "^3.3.9"
+    "@angular-devkit/build-angular": "~0.12.2",
+    "@angular/cli": "~7.2.1",
+    "@angular/compiler-cli": "~7.2.1",
+    "@angular/language-service": "~7.2.1",
+    "@types/node": "~8.9.4",
+    "@types/jasmine": "~2.8.8",
+    "@types/jasminewd2": "~2.0.3",
+    "codelyzer": "~4.5.0",
+    "jasmine-core": "~2.99.1",
+    "jasmine-spec-reporter": "~4.2.1",
+    "karma": "~3.1.4",
+    "karma-chrome-launcher": "~2.2.0",
+    "karma-coverage-istanbul-reporter": "~2.0.1",
+    "karma-jasmine": "~1.1.2",
+    "karma-jasmine-html-reporter": "^0.2.2",
+    "protractor": "~5.4.2",
+    "ts-node": "~7.0.0",
+    "tslint": "~5.12.1",
+    "typescript": "~3.2.4"
   }
 }

angular/test/test-app/scripts/build-ionic.sh

@@ -10,14 +10,6 @@ popd
 pushd angular
 npm link @ionic/core
 npm run build
-npm link
-popd
-
-# Build angular-server
-pushd packages/angular-server
-npm link @ionic/core
-npm link @ionic/angular
-npm run build
 popd
 
 popd

angular/test/test-app/scripts/sync.sh

@@ -1,25 +1,14 @@
 # Copy angular dist
-rm -rf node_modules/@ionic/angular
-mkdir node_modules/@ionic/angular
+rm -rf node_modules/@ionic/angular/dist
 cp -a ../../dist node_modules/@ionic/angular/dist
-cp -a ../../css node_modules/@ionic/angular/css
 cp -a ../../package.json node_modules/@ionic/angular/package.json
 
-# Copy angular server
-rm -rf node_modules/@ionic/angular-server
-mkdir node_modules/@ionic/angular-server
-cp -a ../../../packages/angular-server/dist node_modules/@ionic/angular-server/dist
-cp -a ../../../packages/angular-server/package.json node_modules/@ionic/angular-server/package.json
-
-# # Copy core dist
-rm -rf node_modules/@ionic/core
-mkdir node_modules/@ionic/core
-cp -a ../../../core/css node_modules/@ionic/core/css
+# Copy core dist
+rm -rf node_modules/@ionic/core/dist
 cp -a ../../../core/dist node_modules/@ionic/core/dist
-cp -a ../../../core/hydrate node_modules/@ionic/core/hydrate
 cp -a ../../../core/loader node_modules/@ionic/core/loader
 cp -a ../../../core/package.json node_modules/@ionic/core/package.json
 
-# # Copy ionicons
+# Copy ionicons
 rm -rf node_modules/ionicons
 cp -a ../../../core/node_modules/ionicons node_modules/ionicons

angular/test/test-app/server.ts

@@ -1,58 +0,0 @@
-/**
- * *** NOTE ON IMPORTING FROM ANGULAR AND NGUNIVERSAL IN THIS FILE ***
- *
- * If your application uses third-party dependencies, you'll need to
- * either use Webpack or the Angular CLI's `bundleDependencies` feature
- * in order to adequately package them for use on the server without a
- * node_modules directory.
- *
- * However, due to the nature of the CLI's `bundleDependencies`, importing
- * Angular in this file will create a different instance of Angular than
- * the version in the compiled application code. This leads to unavoidable
- * conflicts. Therefore, please do not explicitly import from @angular or
- * @nguniversal in this file. You can export any needed resources
- * from your application's main.server.ts file, as seen below with the
- * import for `ngExpressEngine`.
- */
-
-import 'zone.js/dist/zone-node';
-
-import * as express from 'express';
-import {join} from 'path';
-
-// Express server
-const app = express();
-
-const PORT = process.env.PORT || 4000;
-const DIST_FOLDER = join(process.cwd(), 'dist/browser');
-
-// * NOTE :: leave this as require() since this file is built Dynamically from webpack
-const {AppServerModuleNgFactory, LAZY_MODULE_MAP, ngExpressEngine, provideModuleMap} = require('./dist/server/main');
-
-// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
-app.engine('html', ngExpressEngine({
-  bootstrap: AppServerModuleNgFactory,
-  providers: [
-    provideModuleMap(LAZY_MODULE_MAP)
-  ]
-}));
-
-app.set('view engine', 'html');
-app.set('views', DIST_FOLDER);
-
-// Example Express Rest API endpoints
-// app.get('/api/**', (req, res) => { });
-// Serve static files from /browser
-app.get('*.*', express.static(DIST_FOLDER, {
-  maxAge: '1y'
-}));
-
-// All regular routes use the Universal engine
-app.get('*', (req, res) => {
-  res.render('index', { req });
-});
-
-// Start up the Node server
-app.listen(PORT, () => {
-  console.log(`Node Express server listening on http://localhost:${PORT}`);
-});

angular/test/test-app/src/app/alert/alert.component.html

@@ -1,10 +0,0 @@
-<ion-header>
-  <ion-toolbar>
-    <ion-title>
-      Alert test
-    </ion-title>
-  </ion-toolbar>
-</ion-header>
-<ion-content>
-  <p>Change Detections: <span id="counter">{{counter()}}</span></p>
-</ion-content>

angular/test/test-app/src/app/alert/alert.component.ts

@@ -1,39 +0,0 @@
-import { Component, NgZone } from '@angular/core';
-import { AlertController } from '@ionic/angular';
-import { NavComponent } from '../nav/nav.component';
-
-@Component({
-  selector: 'app-alert',
-  templateUrl: './alert.component.html',
-})
-export class AlertComponent {
-
-  changes = 0;
-
-  constructor(
-    private alertCtrl: AlertController
-  ) { }
-
-  counter() {
-    this.changes++;
-    return Math.floor(this.changes / 2);
-  }
-
-  async openAlert() {
-    const alert = await this.alertCtrl.create({
-      header: 'Hello',
-      message: 'Some text',
-      buttons: [
-        {
-          role: 'cancel',
-          text: 'Cancel',
-          handler: () => {
-            console.log(NgZone.isInAngularZone());
-            NgZone.assertInAngularZone();
-          }
-        }
-      ]
-    });
-    await alert.present();
-  }
-}

angular/test/test-app/src/app/app-routing.module.ts

@@ -4,9 +4,11 @@ import { InputsComponent } from './inputs/inputs.component';
 import { ModalComponent } from './modal/modal.component';
 import { RouterLinkComponent } from './router-link/router-link.component';
 import { RouterLinkPageComponent } from './router-link-page/router-link-page.component';
-import { RouterLinkPage2Component } from './router-link-page2/router-link-page2.component';
-import { RouterLinkPage3Component } from './router-link-page3/router-link-page3.component';
 import { HomePageComponent } from './home-page/home-page.component';
+import { TabsComponent } from './tabs/tabs.component';
+import { TabsTab1Component } from './tabs-tab1/tabs-tab1.component';
+import { TabsTab1NestedComponent } from './tabs-tab1-nested/tabs-tab1-nested.component';
+import { TabsTab2Component } from './tabs-tab2/tabs-tab2.component';
 import { VirtualScrollComponent } from './virtual-scroll/virtual-scroll.component';
 import { VirtualScrollDetailComponent } from './virtual-scroll-detail/virtual-scroll-detail.component';
 import { NestedOutletComponent } from './nested-outlet/nested-outlet.component';
@@ -19,11 +21,9 @@ import { FormComponent } from './form/form.component';
 import { NavigationPage1Component } from './navigation-page1/navigation-page1.component';
 import { NavigationPage2Component } from './navigation-page2/navigation-page2.component';
 import { NavigationPage3Component } from './navigation-page3/navigation-page3.component';
-import { AlertComponent } from './alert/alert.component';
 
 const routes: Routes = [
   { path: '', component: HomePageComponent },
-  { path: 'alerts', component: AlertComponent },
   { path: 'inputs', component: InputsComponent },
   { path: 'form', component: FormComponent },
   { path: 'modals', component: ModalComponent },
@@ -31,8 +31,6 @@ const routes: Routes = [
   { path: 'providers', component: ProvidersComponent },
   { path: 'router-link', component: RouterLinkComponent },
   { path: 'router-link-page', component: RouterLinkPageComponent },
-  { path: 'router-link-page2/:id', component: RouterLinkPage2Component },
-  { path: 'router-link-page3', component: RouterLinkPage3Component },
   { path: 'slides', component: SlidesComponent },
   { path: 'virtual-scroll', component: VirtualScrollComponent },
   { path: 'virtual-scroll-detail/:itemId', component: VirtualScrollDetailComponent },
@@ -47,7 +45,40 @@ const routes: Routes = [
   },
   {
     path: 'tabs',
-    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
+    component: TabsComponent,
+    children: [
+      {
+        path: 'account',
+        children: [
+          {
+            path: 'nested/:id',
+            component: TabsTab1NestedComponent
+          },
+          {
+            path: '',
+            component: TabsTab1Component
+          }
+        ]
+      },
+      {
+        path: 'contact',
+        children: [
+          {
+            path: 'one',
+            component: TabsTab2Component
+          },
+          {
+            path: '',
+            redirectTo: 'one',
+            pathMatch: 'full'
+          }
+        ]
+      },
+      {
+        path: 'lazy',
+        loadChildren: './tabs-lazy/tabs-lazy.module#TabsLazyModule'
+      }
+    ]
   },
   {
     path: 'nested-outlet',

angular/test/test-app/src/app/app.module.ts

@@ -1,20 +1,21 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
-import { RouteReuseStrategy } from '@angular/router';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
+import { IonicModule } from '@ionic/angular';
 import { FormsModule } from '@angular/forms';
 import { InputsComponent } from './inputs/inputs.component';
 import { ModalComponent } from './modal/modal.component';
 import { ModalExampleComponent } from './modal-example/modal-example.component';
 import { RouterLinkComponent } from './router-link/router-link.component';
 import { RouterLinkPageComponent } from './router-link-page/router-link-page.component';
-import { RouterLinkPage2Component } from './router-link-page2/router-link-page2.component';
-import { RouterLinkPage3Component } from './router-link-page3/router-link-page3.component';
 import { HomePageComponent } from './home-page/home-page.component';
+import { TabsComponent } from './tabs/tabs.component';
+import { TabsTab1Component } from './tabs-tab1/tabs-tab1.component';
+import { TabsTab2Component } from './tabs-tab2/tabs-tab2.component';
+import { TabsTab1NestedComponent } from './tabs-tab1-nested/tabs-tab1-nested.component';
 import { VirtualScrollComponent } from './virtual-scroll/virtual-scroll.component';
 import { VirtualScrollDetailComponent } from './virtual-scroll-detail/virtual-scroll-detail.component';
 import { VirtualScrollInnerComponent } from './virtual-scroll-inner/virtual-scroll-inner.component';
@@ -29,7 +30,6 @@ import { FormComponent } from './form/form.component';
 import { NavigationPage1Component } from './navigation-page1/navigation-page1.component';
 import { NavigationPage2Component } from './navigation-page2/navigation-page2.component';
 import { NavigationPage3Component } from './navigation-page3/navigation-page3.component';
-import { AlertComponent } from './alert/alert.component';
 
 @NgModule({
   declarations: [
@@ -39,9 +39,11 @@ import { AlertComponent } from './alert/alert.component';
     ModalExampleComponent,
     RouterLinkComponent,
     RouterLinkPageComponent,
-    RouterLinkPage2Component,
-    RouterLinkPage3Component,
     HomePageComponent,
+    TabsComponent,
+    TabsTab1Component,
+    TabsTab2Component,
+    TabsTab1NestedComponent,
     VirtualScrollComponent,
     VirtualScrollDetailComponent,
     VirtualScrollInnerComponent,
@@ -55,11 +57,10 @@ import { AlertComponent } from './alert/alert.component';
     FormComponent,
     NavigationPage1Component,
     NavigationPage2Component,
-    NavigationPage3Component,
-    AlertComponent
+    NavigationPage3Component
   ],
   imports: [
-    BrowserModule.withServerTransition({ appId: 'serverApp' }),
+    BrowserModule,
     AppRoutingModule,
     FormsModule,
     ReactiveFormsModule,
@@ -69,9 +70,7 @@ import { AlertComponent } from './alert/alert.component';
     ModalExampleComponent,
     NavComponent
   ],
-  providers: [
-    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
-  ],
+  providers: [],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

angular/test/test-app/src/app/app.server.module.ts

@@ -1,19 +0,0 @@
-import { NgModule } from '@angular/core';
-import { ServerModule } from '@angular/platform-server';
-
-import { IonicServerModule } from '@ionic/angular-server';
-
-import { AppModule } from './app.module';
-import { AppComponent } from './app.component';
-import { ModuleMapLoaderModule } from '@nguniversal/module-map-ngfactory-loader';
-
-@NgModule({
-  imports: [
-    AppModule,
-    ServerModule,
-    ModuleMapLoaderModule,
-    IonicServerModule
-  ],
-  bootstrap: [AppComponent],
-})
-export class AppServerModule {}

angular/test/test-app/src/app/form/form.component.ts

@@ -20,9 +20,7 @@ export class FormComponent {
       input2: ['Default Value'],
       checkbox: [false],
       range: [5, Validators.min(10)],
-    }, {
-      updateOn: typeof (window as any) !== 'undefined' && window.location.hash === '#blur' ? 'blur' : 'change'
-    });
+    }, {updateOn: window.location.hash === '#blur' ? 'blur' : 'change'});
   }
 
   onSubmit(_ev) {

angular/test/test-app/src/app/home-page/home-page.component.html

@@ -7,11 +7,6 @@
   </ion-header>
   <ion-content>
     <ion-list>
-      <ion-item routerLink="/alerts">
-        <ion-label>
-          Alerts test
-        </ion-label>
-      </ion-item>
       <ion-item routerLink="/inputs">
         <ion-label>
           Inputs test

angular/test/test-app/src/app/inputs/inputs.component.html

@@ -6,7 +6,6 @@
   </ion-toolbar>
 </ion-header>
 <ion-content>
-  <p>Change Detections: <span id="counter">{{counter()}}</span></p>
   <ion-list>
 
     <ion-item>
@@ -90,12 +89,10 @@
       <ion-range [(ngModel)]="range"></ion-range>
       <ion-note slot="end" id="range-note">{{range}}</ion-note>
     </ion-item>
-
+    
     <ion-item color="dark">
       <ion-label>Range Mirror</ion-label>
-      <ion-range [(ngModel)]="range">
-        <ion-toggle slot="start" id="nested-toggle" [(ngModel)]="toggle"></ion-toggle>
-      </ion-range>
+      <ion-range [(ngModel)]="range"></ion-range>
       <ion-note slot="end">{{range}}</ion-note>
     </ion-item>
 

angular/test/test-app/src/app/inputs/inputs.component.ts

@@ -12,7 +12,6 @@ export class InputsComponent {
   toggle = true;
   select = 'nes';
   range = 10;
-  changes = 0;
 
   setValues() {
     console.log('set values');
@@ -33,8 +32,4 @@ export class InputsComponent {
     this.select = undefined;
     this.range = undefined;
   }
-  counter() {
-    this.changes++;
-    return Math.floor(this.changes / 2);
-  }
 }

angular/test/test-app/src/app/modal-example/modal-example.component.html

@@ -8,7 +8,7 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content class="ion-padding">
+<ion-content padding>
   <h1>Value</h1>
   <h2>{{value}}</h2>
   <h3>{{valueFromParams}}</h3>

angular/test/test-app/src/app/modal/modal.component.html

@@ -5,7 +5,7 @@
       </ion-title>
     </ion-toolbar>
   </ion-header>
-<ion-content class="ion-padding">
+<ion-content padding>
   <ion-button (click)="openModal()" id="action-button">Open Modal</ion-button>
   <ion-button (click)="openNav()" id="action-button-2">Open Nav in Modal</ion-button>
   <p>

angular/test/test-app/src/app/providers/providers.component.html

@@ -5,22 +5,13 @@
       </ion-title>
     </ion-toolbar>
   </ion-header>
-  <ion-content class="ion-padding">
+  <ion-content padding>
     <p>
       isLoaded: <span id="is-loaded">{{isLoaded}}</span>
     </p>
     <p>
       isReady: <span id="is-ready">{{isReady}}</span>
     </p>
-    <p>
-      isResumed: <span id="is-resumed">{{isResumed}}</span>
-    </p>
-    <p>
-      isPaused: <span id="is-paused">{{isPaused}}</span>
-    </p>
-    <p>
-      isResized: <span id="is-resized">{{isResized}}</span>
-    </p>
     <p>
       isTesting: <span id="is-testing">{{isTesting}}</span>
     </p>

angular/test/test-app/src/app/providers/providers.component.ts

@@ -1,8 +1,8 @@
-import { Component, NgZone } from '@angular/core';
+import { Component } from '@angular/core';
 import {
-  Platform, ModalController, AlertController, ActionSheetController,
-  PopoverController, ToastController, Events, PickerController, MenuController,
-  LoadingController, NavController, DomController, Config
+  Platform, Config, ModalController, AlertController, ActionSheetController,
+  PopoverController, ToastController,  Events, PickerController, MenuController,
+  LoadingController, NavController, DomController
 } from '@ionic/angular';
 
 @Component({
@@ -14,9 +14,6 @@ export class ProvidersComponent {
   isLoaded = false;
   isReady = false;
   isEvent = false;
-  isResumed = false;
-  isPaused = false;
-  isResized = false;
   isTesting: boolean = undefined;
   isDesktop: boolean = undefined;
   isMobile: boolean = undefined;
@@ -35,8 +32,7 @@ export class ProvidersComponent {
     toastCtrl: ToastController,
     navCtrl: NavController,
     domCtrl: DomController,
-    config: Config,
-    zone: NgZone
+    config: Config
   ) {
     // test all providers load
     if (
@@ -48,31 +44,15 @@ export class ProvidersComponent {
 
     // test platform ready()
     platform.ready().then(() => {
-      NgZone.assertInAngularZone();
       this.isReady = true;
     });
-    platform.resume.subscribe(() => {
-      console.log('platform:resume');
-      NgZone.assertInAngularZone();
-      this.isResumed = true;
-    });
-    platform.pause.subscribe(() => {
-      console.log('platform:pause');
-      NgZone.assertInAngularZone();
-      this.isPaused = true;
-    });
-    platform.resize.subscribe(() => {
-      console.log('platform:resize');
-      NgZone.assertInAngularZone();
-      this.isResized = true;
-    });
+
     this.isDesktop = platform.is('desktop');
     this.isMobile = platform.is('mobile');
 
     // test events
     events.subscribe('topic', () => {
       this.isEvent = true;
-      NgZone.assertInAngularZone();
     });
     events.publish('topic');
 
@@ -80,11 +60,5 @@ export class ProvidersComponent {
     this.isTesting = config.getBoolean('_testing');
     config.set('keyboardHeight', 12345);
     this.keyboardHeight = config.getNumber('keyboardHeight');
-
-    zone.runOutsideAngular(() => {
-      document.dispatchEvent(new CustomEvent('pause'));
-      document.dispatchEvent(new CustomEvent('resume'));
-      window.dispatchEvent(new CustomEvent('resize'));
-    });
   }
 }

angular/test/test-app/src/app/router-link-page/router-link-page.component.html

@@ -7,9 +7,8 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content class="ion-padding">
+<ion-content padding>
   <p>ngOnInit: <span id="ngOnInit">{{onInit}}</span></p>
-  <p>canGoBack: <span id="canGoBack">{{canGoBack}}</span></p>
   <p>ionViewWillEnter: <span id="ionViewWillEnter">{{willEnter}}</span></p>
   <p>ionViewDidEnter: <span id="ionViewDidEnter">{{didEnter}}</span></p>
   <p>ionViewWillLeave: <span id="ionViewWillLeave">{{willLeave}}</span></p>

angular/test/test-app/src/app/router-link-page/router-link-page.component.ts

@@ -1,5 +1,4 @@
 import { Component, OnInit, NgZone } from '@angular/core';
-import { IonRouterOutlet } from '@ionic/angular';
 
 @Component({
   selector: 'app-router-link-page',
@@ -12,15 +11,9 @@ export class RouterLinkPageComponent implements OnInit {
   didEnter = 0;
   willLeave = 0;
   didLeave = 0;
-  canGoBack: boolean = null;
-
-  constructor(
-    private ionRouterOutlet: IonRouterOutlet
-  ) {}
 
   ngOnInit() {
     NgZone.assertInAngularZone();
-    this.canGoBack = this.ionRouterOutlet.canGoBack();
     this.onInit++;
   }
 
@@ -28,16 +21,10 @@ export class RouterLinkPageComponent implements OnInit {
     if (this.onInit !== 1) {
       throw new Error('ngOnInit was not called');
     }
-    if (this.canGoBack !== this.ionRouterOutlet.canGoBack()) {
-      throw new Error('canGoBack() changed');
-    }
     NgZone.assertInAngularZone();
     this.willEnter++;
   }
   ionViewDidEnter() {
-    if (this.canGoBack !== this.ionRouterOutlet.canGoBack()) {
-      throw new Error('canGoBack() changed');
-    }
     NgZone.assertInAngularZone();
     this.didEnter++;
   }

angular/test/test-app/src/app/router-link-page2/router-link-page2.component.html

@@ -1,12 +0,0 @@
-<ion-header>
-  <ion-toolbar>
-    <ion-buttons slot="start">
-      <ion-back-button></ion-back-button>
-    </ion-buttons>
-    <ion-title>Router Page 2</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content class="ion-padding">
-  <ion-button routerLink="/router-link-page3" id="goToPage3">Go to Page 3</ion-button>
-</ion-content>

angular/test/test-app/src/app/router-link-page2/router-link-page2.component.ts

@@ -1,14 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-router-link-page2',
-  templateUrl: './router-link-page2.component.html'
-})
-export class RouterLinkPage2Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}

angular/test/test-app/src/app/router-link-page3/router-link-page3.component.html

@@ -1,12 +0,0 @@
-<ion-header>
-  <ion-toolbar color="dark">
-    <ion-buttons slot="start">
-      <ion-back-button defaultHref="/?token=ABC#fragment" id="goBackFromPage3"></ion-back-button>
-    </ion-buttons>
-    <ion-title>Router Page 3</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content class="ion-padding">
-  Page 3
-</ion-content>

angular/test/test-app/src/app/router-link-page3/router-link-page3.component.ts

@@ -1,14 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-router-link-page3',
-  templateUrl: './router-link-page3.component.html'
-})
-export class RouterLinkPage3Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}

angular/test/test-app/src/app/router-link/router-link.component.html

@@ -5,13 +5,12 @@
     </ion-title>
   </ion-toolbar>
 </ion-header>
-<ion-content class="ion-padding">
+<ion-content padding>
   <p>ngOnInit: <span id="ngOnInit">{{onInit}}</span></p>
   <p>ionViewWillEnter: <span id="ionViewWillEnter">{{willEnter}}</span></p>
   <p>ionViewDidEnter: <span id="ionViewDidEnter">{{didEnter}}</span></p>
   <p>ionViewWillLeave: <span id="ionViewWillLeave">{{willLeave}}</span></p>
   <p>ionViewDidLeave: <span id="ionViewDidLeave">{{didLeave}}</span></p>
-  <p>Change Detections: <span id="counter">{{counter()}}</span></p>
 
   <p>
     <ion-button routerLink="/router-link-page" expand="block" color="dark" id="routerLink">ion-button[routerLink]</ion-button>
@@ -28,6 +27,4 @@
   <p><button (click)="navigateRoot()" id="button-root">navigateForward</button></p>
   <p><button (click)="navigateBack()" id="button-back">navigateBack</button></p>
 
-  <p><button id="queryParamsFragment" routerLink="/router-link-page2/MyPageID==" [queryParams]="{ token: 'A&=#Y' }" fragment="myDiv1">Query Params and Fragment</button></p>
-
 </ion-content>

angular/test/test-app/src/app/router-link/router-link.component.ts

@@ -13,7 +13,6 @@ export class RouterLinkComponent implements OnInit {
   didEnter = 0;
   willLeave = 0;
   didLeave = 0;
-  changes = 0;
 
   constructor(
     private navCtrl: NavController,
@@ -36,11 +35,6 @@ export class RouterLinkComponent implements OnInit {
     this.navCtrl.navigateRoot('/router-link-page');
   }
 
-  counter() {
-    this.changes++;
-    return Math.floor(this.changes / 2);
-  }
-
   ngOnInit() {
     NgZone.assertInAngularZone();
     this.onInit++;

angular/test/test-app/src/app/slides/slides.component.ts

@@ -1,4 +1,4 @@
-import { AfterViewInit, Component, ViewChild } from '@angular/core';
+import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';
 import { IonSlides } from '@ionic/angular';
 
 @Component({
@@ -6,7 +6,7 @@ import { IonSlides } from '@ionic/angular';
   templateUrl: './slides.component.html',
 })
 export class SlidesComponent implements AfterViewInit {
-  @ViewChild(IonSlides, { static: true }) slides: IonSlides;
+  @ViewChild(IonSlides) slides: IonSlides;
 
   slideIndex = 0;
   slideIndex2 = 0;

angular/test/test-app/src/app/tabs-lazy/tabs-tab3-nested/tabs-tab3-nested.component.html

@@ -7,9 +7,9 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content class="ion-padding">
+<ion-content padding>
   <p>
     <ion-button routerLink="/tabs/account" id="goto-tab1-page1">Go to Tab 1 - Page 1</ion-button>
-    <ion-button routerLink="/tabs/account/nested/1" id="goto-tab1-page2">Go to Tab 1 - Page 2</ion-button>
+    <ion-button routerLink="/tabs/account/nested/12" id="goto-tab1-page2">Go to Tab 1 - Page 2</ion-button>
   </p>
 </ion-content>

angular/test/test-app/src/app/tabs-lazy/tabs-tab3/tabs-tab3.component.html

@@ -4,11 +4,11 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content class="ion-padding">
+<ion-content padding>
   <h1>LAZY LOADED TAB</h1>
   <p>
     <ion-button routerLink="/tabs/account" id="goto-tab1-page1">Go to Tab 1 - Page 1</ion-button>
-    <ion-button routerLink="/tabs/account/nested/1" id="goto-tab1-page2">Go to Tab 1 - Page 2</ion-button>
+    <ion-button routerLink="/tabs/account/nested/12" id="goto-tab1-page2">Go to Tab 1 - Page 2</ion-button>
     <ion-button routerLink="/tabs/lazy/nested" id="goto-tab3-page2">Go to Tab 3 - Page 2</ion-button>
 
   </p>

angular/test/test-app/src/app/tabs-tab1-nested/tabs-tab1-nested.component.html

@@ -1,17 +1,16 @@
 <ion-header>
   <ion-toolbar>
-    <ion-title>Tab 1 - Page 2 ({{id}})</ion-title>
+    <ion-title>Tab 1 - Page 2</ion-title>
     <ion-buttons slot="start">
       <ion-back-button></ion-back-button>
     </ion-buttons>
   </ion-toolbar>
 </ion-header>
 
-<ion-content class="ion-padding">
-  <h1>Welcome to NESTED PAGE {{id}}</h1>
+<ion-content padding>
+  <h1>Welcome to NESTED PAGE</h1>
   <p>
     <ion-button routerLink="/tabs/account" id="goto-tab1-page1">Go to Tab 1 - Page 1</ion-button>
     <ion-button routerLink="/tabs/contact" id="goto-tab2-page1">Go to Tab 2 - Page 1</ion-button>
-    <ion-button routerLink="/tabs/account/nested/{{next()}}" id="goto-next">Go to Next</ion-button>
   </p>
 </ion-content>

angular/test/test-app/src/app/tabs-tab1-nested/tabs-tab1-nested.component.ts

@@ -1,21 +1,7 @@
-import { ActivatedRoute } from '@angular/router';
-import { Component, Input } from '@angular/core';
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-tabs-tab1-nested',
   templateUrl: './tabs-tab1-nested.component.html',
 })
-export class TabsTab1NestedComponent {
-  id = '';
-  constructor(
-    private route: ActivatedRoute,
-  ) {}
-
-  ngOnInit() {
-    this.id = this.route.snapshot.paramMap.get('id');
-  }
-
-  next() {
-    return parseInt(this.id, 10) + 1;
-  }
-}
+export class TabsTab1NestedComponent { }