[grid] performance tests (#5597)

* chore(perf): adding performance tests

* chore(*): perf test progress

* chore(*): some further test changes

* chore(*): adding all tests

* test(grid): adding perf tests that run mutation obs #5530

* chore(*): refactoring perf tests

* chore(grid): changing grouping  rendering for travis

* chore(*): another switchup for travis

* chore(*): changing target times

* chore(*): changing timings

* chore(*): making tests wait for each other

* chore(*): stabilizing tests

* chore(*): final tests to measure perf

* chore(*): fixing jslint error

* chore(*): removing console.logs

* chore(*): upping limits because of flicker

* chore(*): splitting perf tests from the rest

* chore(*): package-lock commit

* chore(*): changing test order

* chore(*): xiting mutation observer tests

* chore(*): some small fixes to tests

* chore(*): modifying target so that we ensure better than 7.3 perf

* chore(*): fixing wrong merge

Author: ChronosSF

.travis.yml

@@ -22,6 +22,7 @@ script:
 - npm run lint:lib
 - ng build igniteui-angular --prod
 - npm run build:style
+- if [ -z "${TRAVIS_TAG}" ]; then npm run test:lib:perf; fi
 - if [ -z "${TRAVIS_TAG}" ]; then npm run test:lib:others; fi
 - if [ -z "${TRAVIS_TAG}" ]; then npm run test:lib:grid; fi
 - if [ -z "${TRAVIS_TAG}" ]; then npm run test:lib:tgrid; fi

package-lock.json

@@ -9,6 +9,7 @@
     "lint": "ng lint",
     "e2e": "ng e2e",
     "test:lib": "ng test igniteui-angular --watch=false --no-progress --code-coverage",
+    "test:lib:perf": "ng test igniteui-angular --watch=false --no-progress --karma-config=./projects/igniteui-angular/karma.test-perf.conf.js",
     "test:lib:azure": "ng test igniteui-angular --watch=false --no-progress --code-coverage --karma-config=./projects/igniteui-angular/karma.azure.conf.js",
     "test:lib:grid": "ng test igniteui-angular --watch=false --no-progress --code-coverage --karma-config=./projects/igniteui-angular/karma.grid.conf.js",
     "test:lib:tgrid": "ng test igniteui-angular --watch=false --no-progress --code-coverage --karma-config=./projects/igniteui-angular/karma.tree-grid.conf.js",

package.json

@@ -4,7 +4,7 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    frameworks: ['jasmine', 'jasmine-spec-tags', '@angular-devkit/build-angular'],
     files: [
       { pattern: '../../node_modules/hammerjs/hammer.min.js', watched: false },
       { pattern: '../../node_modules/hammer-simulator/index.js', watched: false },
@@ -14,6 +14,7 @@ module.exports = function (config) {
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
+      require('karma-jasmine-spec-tags'),
       require('karma-junit-reporter'),
       require('karma-coverage-istanbul-reporter'),
       require('karma-spec-reporter'),
@@ -23,7 +24,9 @@ module.exports = function (config) {
       clearContext: false, // leave Jasmine Spec Runner output visible in browser
       jasmine: {
         random: false
-      }
+      },
+      tagPrefix: '#',
+      skipTags: 'perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage'),

projects/igniteui-angular/karma.azure.conf.js

@@ -26,7 +26,8 @@ module.exports = function (config) {
         random: false
       },
       tagPrefix: '#',
-      tags: 'grid'
+      tags: 'grid',
+      skipTags: 'perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage/grid'),

projects/igniteui-angular/karma.azure.grid.conf.js

@@ -26,7 +26,7 @@ module.exports = function (config) {
         random: false
       },
       tagPrefix: '#',
-      skipTags: 'hGrid,tGrid,grid'
+      skipTags: 'hGrid,tGrid,grid,perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage/non-grid'),

projects/igniteui-angular/karma.azure.non-grid.conf.js

@@ -4,7 +4,7 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    frameworks: ['jasmine', 'jasmine-spec-tags', '@angular-devkit/build-angular'],
     files: [
       { pattern: '../../node_modules/hammerjs/hammer.min.js', watched: false },
       { pattern: '../../node_modules/hammer-simulator/index.js', watched: false },
@@ -14,6 +14,7 @@ module.exports = function (config) {
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
+      require('karma-jasmine-spec-tags'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage-istanbul-reporter'),
       require('karma-spec-reporter'),
@@ -23,7 +24,9 @@ module.exports = function (config) {
       clearContext: false, // leave Jasmine Spec Runner output visible in browser
       jasmine: {
         random: false
-      }
+      },
+      tagPrefix: '#',
+      skipTags: 'perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage'),

projects/igniteui-angular/karma.conf.js

@@ -26,7 +26,8 @@ module.exports = function (config) {
         random: false
       },
       tagPrefix: '#',
-      tags: 'grid'
+      tags: 'grid',
+      skipTags: 'perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage/grid'),

projects/igniteui-angular/karma.grid.conf.js

@@ -26,7 +26,7 @@ module.exports = function (config) {
         random: false
       },
       tagPrefix: '#',
-      skipTags: 'hGrid,tGrid,grid'
+      skipTags: 'hGrid,tGrid,grid,perf'
     },
     coverageIstanbulReporter: {
       dir: require('path').join(__dirname, '../../coverage/non-grid'),

projects/igniteui-angular/karma.non-grid.conf.js

@@ -0,0 +1,42 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+    config.set({
+      basePath: '',
+      frameworks: ['jasmine', 'jasmine-spec-tags', '@angular-devkit/build-angular'],
+      files: [
+        { pattern: '../../node_modules/hammerjs/hammer.min.js', watched: false },
+        { pattern: '../../node_modules/hammer-simulator/index.js', watched: false },
+        { pattern: './test.css', watched: false },
+        { pattern: '../../dist/igniteui-angular/styles/igniteui-angular.css', watched: false }
+      ],
+      plugins: [
+        require('karma-jasmine'),
+        require('karma-chrome-launcher'),
+        require('karma-jasmine-spec-tags'),
+        require('karma-jasmine-html-reporter'),
+        require('karma-spec-reporter'),
+        require('@angular-devkit/build-angular/plugins/karma')
+      ],
+      client: {
+        clearContext: false, // leave Jasmine Spec Runner output visible in browser
+        jasmine: {
+          random: false
+        },
+        tagPrefix: '#',
+        tags: 'perf'
+      },
+      reporters: ['spec'],
+      specReporter: {
+          suppressSkipped: true
+      },
+      port: 9876,
+      colors: true,
+      logLevel: config.LOG_INFO,
+      autoWatch: true,
+      browsers: ['Chrome'],
+      singleRun: false
+    });
+  };
+