Jasmine unit tests run in Chrome but not in PhantomJs - jasmine

I have a project that was created with the angular cli. I generate new components with the cli and even the most basic tests fail when using PhantomJS with the following stack.
× should create an instance
PhantomJS 2.1.1 (Windows 8 0.0.0)
Failed: undefined is not a constructor (evaluating 'attr.name.startsWith(_I18N_ATTR_PREFIX)')
http://localhost:9876/_karma_webpack_/vendor.bundle.js:48660:70
filter#[native code]
_visitAttributesOf#http://localhost:9876/_karma_webpack_/vendor.bundle.js:48660:24
visitElement#http://localhost:9876/_karma_webpack_/vendor.bundle.js:48603:32
visit#http://localhost:9876/_karma_webpack_/vendor.bundle.js:40053:62
http://localhost:9876/_karma_webpack_/vendor.bundle.js:48595:59
forEach#[native code]
visitElement#http://localhost:9876/_karma_webpack_/vendor.bundle.js:48594:31
visit#http://localhost:9876/_karma_webpack_/vendor.bundle.js:40053:62
http://localhost:9876/_karma_webpack_/vendor.bundle.js:48595:59
forEach#[native code]
visitElement#http://localhost:9876/_karma_webpack_/vendor.bundle.js:48594:31
visit#http://localhost:9876/_karma_webpack_/vendor.bundle.js:40053:62
http://localhost:9876/_karma_webpack_/vendor.bundle.js:48595:59
forEach#[native code]
visitElement#http://localhost:9876/_karma_webpack_/vendor.bundle.js:48594:31
I suspect that there is some incompatibility with my combination of npm packages. Here is my package.json
"dependencies": {
"#angular/animations": "^5.0.2",
"#angular/common": "^5.0.2",
"#angular/compiler": "^5.0.2",
"#angular/core": "^5.0.2",
"#angular/forms": "^5.0.2",
"#angular/http": "^5.0.2",
"#angular/platform-browser": "^5.0.2",
"#angular/platform-browser-dynamic": "^5.0.2",
"#angular/router": "^5.0.2",
"angularfire2": "^5.0.0-rc.4",
"core-js": "^2.4.1",
"crds-styles": "^1.3.1",
"firebase": "^4.6.2",
"intl": "^1.2.5",
"ng2-toastr": "^4.1.2",
"ngx-bootstrap": "1.9.3",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"#angular/cli": "1.5.4",
"#angular/compiler-cli": "^5.0.2",
"#angular/language-service": "^5.0.2",
"#types/jasmine": "2.5.38",
"#types/jasminewd2": "~2.0.2",
"#types/node": "~6.0.89",
"codelyzer": "^4.0.1",
"firebase-tools": "^3.15.4",
"jasmine-core": "~2.6.0",
"jasmine-spec-reporter": "~4.2.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-mocha-reporter": "2.2.4",
"karma-phantomjs-launcher": "^1.0.4",
"karma-teamcity-reporter": "^1.0.0",
"prettier": "^1.9.2",
"protractor": "~5.1.2",
"replace": "^0.3.0",
"ts-node": "~2.0.0",
"tslint": "~5.7.0",
"tslint-config-prettier": "^1.6.0",
"typescript": "2.5.3"
}
Any ideas?

You use the startsWith() method which was introduced in ECMAScript 6. Phantom JS currently does not support this JS version. You can see the current status here : https://github.com/ariya/phantomjs/issues/14506 . You could use ChromeHeadless instead or skip the files that contain ES6 code (but they won't be tested).

Related

Uncaught TypeError: Cannot read properties of undefined (reading 'document')

I am using nvd3 charts(nvd3-1.8.5, d3-3.5.17), facing the below issue after Upgrading from angular 12 to angular 14. When it was in angular 12 I didn't face any issues.
Uncaught TypeError: Cannot read properties of undefined (reading 'document')
at d3.js:8:26
at 83064 (d3.js:1:2)
at __webpack_require__ (bootstrap:19:1)
at 54058 (index.ts:8:44)
at __webpack_require__ (bootstrap:19:1)
at 84096 (settings.saveview.html:41:141)
at __webpack_require__ (bootstrap:19:1)
at 70299 (UserServiceResolver.ts:18:33)
at __webpack_require__ (bootstrap:19:1)
at 64349 (viewlogmessage.html:65:57)
Even I tried with nvd3 1.8.5 with d3 4.0.0(With Angular 14) getting the below issue.
core.mjs:6397 ERROR TypeError: nv.dispatch.render_start is not a function
at Object.render (nv.d3.js:93:17)
at nv.addGraph (nv.d3.js:145:12)
at ViewActionsComponent.ts:169:17
at Array.forEach (<anonymous>)
at ViewActionsComponent.onGetMessageSuccessCallback (ViewActionsComponent.ts:140:11)
at SafeSubscriber._next (ViewActionsComponent.ts:83:36)
at SafeSubscriber.__tryOrUnsub (Subscriber.js:183:16)
at SafeSubscriber.next (Subscriber.js:122:22)
at Subscriber._next (Subscriber.js:72:26)
at Subscriber.next (Subscriber.js:49:18)
Adding package.json configuration for reference.
"devDependencies": {
"#angular-devkit/build-angular": "^14.0.2",
"#angular/cli": "^14.0.2",
"#angular/compiler-cli": "^14.0.2",
"#types/ace": "0.0.32",
"#types/angular": "1.6.21",
"#types/argparse": "1.0.30",
"#types/ckeditor": "0.0.37",
"#types/core-js": "0.9.36",
"#types/d3": "^3.5.47",
"#types/d3pie": "^0.1.5",
"#types/glob": "5.0.30",
"#types/jasmine": "~3.6.0",
"#types/jasminewd2": "2.0.2",
"#types/jquery": "3.5.6",
"#types/lodash": "^4.14.182",
"#types/minimatch": "2.0.29",
"#types/node": "^12.20.50",
"#types/nvd3": "^1.8.42",
"#types/shelljs": "0.7.0",
"access-sniff": "2.4.61",
"angular2-template-loader": "0.6.2",
"argparse": "1.0.9",
"awesome-typescript-loader": "3.1.2",
"babel-preset-es2015": "6.18.0",
"bootstrap": "3.4.1",
"codelyzer": "^6.0.0",
"copy-webpack-plugin": "4.0.1",
"copyfiles": "1.0.0",
"cross-env": "^5.0.5",
"css-loader": "0.27.3",
"d3": "4.0.0",
"d3pie": "0.1.5",
"extract-text-webpack-plugin": "3.0.2",
"file-appender": "^1.1.0",
"fs": "0.0.1-security",
"fs-extra": "5.0.0",
"glob": "7.1.1",
"glob-concat": "^1.0.1",
"gnomon": "1.5.0",
"increase-memory-limit": "^1.0.3",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"js-yaml": "^3.13.1",
"less": "2.7.1",
"less-loader": "4.0.5",
"less-plugin-clean-css": "1.5.1",
"lite-server": "^2.6.1",
"mkdirp": "^0.5.6",
"ncp": "2.0.0",
"npm-build-tools": "^2.2.5",
"nvd3": "1.8.5",
"perfect-scrollbar": "0.8.1",
"protractor": "~7.0.0",
"raw-loader": "0.5.1",
"remap-istanbul": "0.7.0",
"rimraf": "2.5.4",
"rollup-loader": "^0.3.0",
"shelljs": "0.7.5",
"style-loader": "0.16.1",
"systemjs": "^6.12.1",
"time-grunt": "^1.4.0",
"to-string-loader": "1.1.5",
"ts-helpers": "1.1.1",
"ts-node": "~3.2.0",
"tslint": "~6.1.0",
"typedoc": "0.5.7",
"typescript": "~4.6.4",
"uglify-js": "3.0.26",
"webpack-dev-server": "3.11.2"
},
"dependencies": {
"#angular/animations": "^14.0.2",
"#angular/common": "^14.0.2",
"#angular/compiler": "^14.0.2",
"#angular/core": "^14.0.2",
"#angular/forms": "^14.0.2",
"#angular/localize": "^14.0.2",
"#angular/platform-browser": "^14.0.2",
"#angular/platform-browser-dynamic": "^14.0.2",
"#angular/platform-server": "^14.0.2",
"#angular/router": "^14.0.2",
"#ng-bootstrap/ng-bootstrap": "^9.1.3",
"#ngx-translate/core": "^13.0.0",
"#ngx-translate/http-loader": "^6.0.0",
"#types/bootstrap": "^5.1.10",
"ace-builds": "^1.4.14",
"ag-grid-angular": "^26.1.0",
"ag-grid-community": "^26.1.0",
"circular-dependency-plugin": "^5.2.2",
"commonjs-require": "1.4.6",
"core-js": "^2.6.7",
"es6-collections": "0.5.6",
"es6-promise": "3.3.1",
"es6-shim": "0.34.1",
"fs": "0.0.1-security",
"jquery": "^3.6.0",
"moment": "^2.29.3",
"pdfjs-dist": "2.0.489",
"plotly.js": "2.12.1",
"plugin-typescript": "4.0.17",
"reflect-metadata": "0.1.9",
"rxjs": "^6.6.0",
"rxjs-compat": "^6.6.7",
"rxjs-tslint": "^0.1.8",
"ts-smart-logger": "0.0.4",
"tslib": "^2.4.0",
"webpack": "^5.73.0",
"zone.js": "^0.11.5"
}
Any idea how to fix this error?
I know it might be no a right fix, but
remove all import d3
use CDN link in your index.html file:
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.7/d3.min.js"
integrity="sha512-MbgT+83UxCH6sDPhdRyAqCvG+93y1xm6SIC/1T15gWsbkC2bjGqHVWepfhPMocnEOhgXBtZCOxHmwq0XPsqSGQ=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
I've faced same issue, so I took ^ actions.
Regarding types d3 js types, u can have it as dependecies.

object(...) is not a function when publish angular 11 application

I had application in angular 6 with .net core 2.1 and now I upgraded into 11 with .Net 5 and its works fine in my local system but when I published to Azure virtual machine at that time it is giving me below error, I already update necessary package like Angular CLI and .NET runtime at vitual machine so not sure why this error appear
here is my package.json
"dependencies": {
"#agm/core": "1.0.0",
"#angular/animations": "^11.2.8",
"#angular/cdk": "^11.2.7",
"#angular/common": "11.2.8",
"#angular/compiler": "11.2.8",
"#angular/core": "11.2.8",
"#angular/forms": "11.2.8",
"#angular/http": "7.2.16",
"#angular/localize": "^11.2.8",
"#angular/platform-browser": "11.2.8",
"#angular/platform-browser-dynamic": "11.2.8",
"#angular/router": "11.2.8",
"#ng-bootstrap/ng-bootstrap": "^9.1.0",
"#nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.8",
"#ngx-translate/core": "^9.1.1",
"#ngx-translate/http-loader": "^2.0.1",
"#progress/telerik-angular-report-viewer": "^11.20.1021",
"#ryancavanaugh/jquery.prettyphoto": "^3.1.14-alpha",
"#types/googlemaps": "^3.43.3",
"#videogular/ngx-videogular": "^3.0.1",
"adal-angular4": "^3.0.16",
"angular-google-charts": "^0.1.6",
"angular-moment": "^1.3.0",
"angular-safeguard": "^2.1.0",
"aspnet-prerendering": "^3.0.1",
"bootstrap": "^4.6.0",
"core-js": "^2.6.12",
"file-saver": "^2.0.5",
"flexslider": "^2.7.2",
"font-awesome": "^4.7.0",
"google-code-prettify": "^1.0.5",
"html2canvas": "^1.0.0-alpha.12",
"jquery": "^3.6.0",
"jquery.easing": "^1.4.1",
"jspdf": "^2.3.1",
"jspdf-autotable": "^3.5.14",
"modernizr": "^3.11.6",
"moment": "^2.29.1",
"moment-timezone": "^0.5.32",
"ng-drag-drop": "5.0.0",
"ng2-pdfjs-viewer": "^5.0.7",
"ngx-material-timepicker": "^3.3.1",
"ngx-sortablejs": "^11.1.0",
"ngx-spinner": "^6.1.2",
"popper.js": "^1.16.1",
"primeflex": "^2.0.0",
"primeicons": "^1.0.0",
"primeng": "^11.3.1",
"rxjs": "^6.6.7",
"rxjs-compat": "^6.6.7",
"sequencejs": "^2.0.0",
"sortablejs": "1.7.0",
"videogular2": "^7.0.2",
"xlsx": "^0.16.9",
"yarn": "^1.22.10",
"zone.js": "^0.10.3"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.1102.6",
"#angular/cli": "^11.2.6",
"#angular/compiler-cli": "^11.2.8",
"#angular/language-service": "11.2.8",
"#types/core-js": "^0.9.46",
"#types/flexslider": "0.0.2",
"#types/jasmine": "^2.8.17",
"#types/jasminewd2": "^2.0.8",
"#types/jquery": "^3.5.5",
"#types/jspdf": "^1.3.3",
"#types/modernizr": "^3.5.3",
"#types/node": "^6.14.13",
"codelyzer": "^4.5.0",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^6.3.2",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.4.3",
"karma-jasmine": "^1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^7.0.0",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "4.1.5"
}
Any help would be appreciated
This is likely an issue with one of your dependencies, which you should generally update alongside updating the framework.
I can see "ngx-spinner": "^6.1.2" in your package.json file, can you please check its version as well. It should be 11.0.2, try to install that specific version and check again.

How do I fix my "Failed to find module: "#angular/compiler" error?

I've upgraded to the latest nativescript, typescript and using angular. Now whenever I try to compile, I get this error, regardless of the platform I am compiling to.
Error: com.tns.NativeScriptException: Failed to find module: "#angular/compiler", relative to: app/tns_modules/
below are my package.json dependencies:
"dependencies": {
"#angular/animations": "~6.1.0",
"#angular/common": "~6.1.0",
"#angular/core": "~6.1.0",
"#angular/forms": "~6.1.0",
"#angular/http": "~6.1.0",
"#angular/platform-browser": "~6.1.0",
"#angular/platform-browser-dynamic": "~6.1.0",
"#angular/router": "~6.1.0",
"async-await": "^0.1.40",
"lodash": "^4.17.10",
"moment": "^2.22.0",
"nativescript-angular": "^6.1.0",
"nativescript-audio": "^5.0.0",
"nativescript-drop-down": "^4.0.1",
"nativescript-orientation": "^2.2.0",
"nativescript-theme-core": "^1.0.4",
"nativescript-ui-listview": "3.5.9",
"nativescript-ui-sidedrawer": "^4.1.1",
"nativescript-unit-test-runner": "^0.3.4",
"nativescript-videoplayer": "^4.1.0",
"nativescript-webview-interface": "^1.4.2",
"nativescript-xmlobjects": "^1.1.4",
"node-sass": "^4.9.2",
"reflect-metadata": "~0.1.8",
"rxjs": "^6.0.0",
"tns-core-modules": "^4.2.1",
"zone.js": "^0.8.26"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.10.3",
"#angular/cli": "^7.0.3",
"#angular/compiler": "^6.1.10",
"#angular/compiler-cli": "~6.1.0",
"#types/lodash": "4.14.68",
"#types/node": "~6.0.60",
"babel-traverse": "^6.26.0",
"babel-types": "^6.26.0",
"babylon": "6.4.5",
"jasmine-core": "^3.1.0",
"karma": "^3.1.1",
"karma-jasmine": "^1.1.1",
"karma-nativescript-launcher": "^0.4.0",
"lazy": "1.0.11",
"nativescript-dev-sass": "^1.6.0",
"nativescript-dev-typescript": "^0.7.4",
"nativescript-dev-webpack": "^0.16.3",
"tns-platform-declarations": "^3.4.1",
"ts-node": "~3.3.0",
"tslint": "^5.8.0",
"typescript": "~2.7.2",
"webpack": "^4.23.1",
"webpack-dev-server": "^3.1.10"
},
#angular/compiler supposed to be under dependencies, not devDependencies. Also with latest version, they use #ngtools/webpack instead of the actual webpack package.
So it could be better if you compare your package.json with the one in the default template and make necessary changes.

Unexpected EventSource requests after updating Angular 4.4 to 5.2

I am trying to migrate web application I'm working on to Angular 5.2.
Followed the instructions on https://angular-update-guide.firebaseapp.com/ ,
I've been able to run the application in the development mode using 'ng serve -lr' as usually.
However, after application launches, multiple HTTP requests, which weren't triggering on Angular 4.4 are executing and eventually, webpack-dev-server disconnects.
My package.json on Angular 4.4, before update:
"dependencies": {
"#agm/core": "^1.0.0-beta.1",
"#angular/animations": "^4.4.0-RC.0",
"#angular/cdk": "^2.0.0-beta.10",
"#angular/common": "^4.4.4",
"#angular/compiler": "^4.4.4",
"#angular/core": "^4.4.4",
"#angular/forms": "^4.4.4",
"#angular/http": "^4.4.4",
"#angular/material": "^2.0.0-beta.10",
"#angular/platform-browser": "^4.4.4",
"#angular/platform-browser-dynamic": "^4.4.4",
"#angular/router": "^4.4.4",
"#ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"#types/jquery": "^3.2.12",
"angular2-multiselect-dropdown": "^1.3.6",
"angular2-text-mask": "^8.0.4",
"autoprefixer": "^7.1.1",
"bootstrap": "^4.0.0-beta.2",
"core-js": "^2.4.1",
"jquery": "^3.2.1",
"lodash": "^4.17.4",
"moment": "^2.19.1",
"ng2-daterangepicker": "^2.0.12",
"rxjs": "^5.1.0",
"tinymce": "^4.6.7",
"zone.js": "^0.8.4"
}, "devDependencies": {
"#angular/cli": "1.4.5",
"#angular/compiler-cli": "^4.4.4",
"#types/jasmine": "2.5.38",
"#types/node": "~6.0.60",
"codelyzer": "~2.0.0",
"concurrently": "^3.4.0",
"htmlhint-ng2": "0.0.13",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-server": "^0.10.1",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.0",
"sass-lint": "latest",
"scss-lint": "0.0.0",
"scss-lint-html-reporter": "^0.3.2",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0"
},
"sasslintConfig": "sass-lint.yml"
}
package.json after update to angular 5.2:
"private": true,
"dependencies": {
"#agm/core": "^1.0.0-beta.2",
"#angular/animations": "^5.2.3",
"#angular/cdk": "^5.1.1",
"#angular/common": "^5.2.3",
"#angular/compiler": "^5.2.3",
"#angular/core": "^5.2.3",
"#angular/forms": "^5.2.3",
"#angular/http": "^5.2.3",
"#angular/material": "^5.1.1",
"#angular/platform-browser": "^5.2.3",
"#angular/platform-browser-dynamic": "^5.2.3",
"#angular/platform-server": "^5.2.3",
"#angular/router": "^5.2.3",
"#ng-bootstrap/ng-bootstrap": "^1.0.0",
"#types/jquery": "^3.2.12",
"angular2-multiselect-dropdown": "^1.3.6",
"angular2-text-mask": "^8.0.4",
"autoprefixer": "^7.2.5",
"bootstrap": "^4.0.0",
"core-js": "^2.5.3",
"file-loader": "^1.1.6",
"jquery": "^3.2.1",
"lodash": "^4.17.5",
"mixpanel-browser": "^2.17.0",
"moment": "^2.19.1",
"ng2-daterangepicker": "^2.0.12",
"node-sass": "^4.7.2",
"popper.js": "^1.12.9",
"rxjs": "^5.5.6",
"tinymce": "^4.7.6",
"zone.js": "^0.8.20"
},
"devDependencies": {
"#angular/cli": "^1.6.7",
"#angular/compiler-cli": "^5.2.3",
"#types/jasmine": "2.5.38",
"#types/node": "^6.0.96",
"codelyzer": "^4.1.0",
"concurrently": "^3.5.1",
"htmlhint-ng2": "0.0.13",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-server": "^0.10.1",
"karma": "^2.0.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "^1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.0",
"sass-lint": "latest",
"scss-lint": "0.0.0",
"scss-lint-html-reporter": "^0.3.2",
"ts-node": "~2.0.0",
"tslint": "^5.9.1",
"typescript": "^2.6.2",
"webpack": "^3.10.0"
},
"sasslintConfig": "sass-lint.yml"
}
Unexpected requests in the network tab of Chrome Dev Tools
Browser console errors
Similar issue posted on angular-cli GitHub page
Seems like the problem was in webpack live reloading. Solved it by adding parameter to launch script, now it is
ng serve --public-host http://localhost:4200/ -lr

reusable custom-filter components reset after dropdownlist lost focus

I'm trying to use the example of Reusable Custom-Filter Components. If I check the provided Plunker example I changed the filter. After I clicked somewhere else the filter is reseted to default item. How can I achieve that the filter stays so I can do other stuff on grid?
Here an excerpt from package.json:
"#angular/animations": "^5.0.4",
"#angular/common": "~5.0.0",
"#angular/compiler": "~5.0.0",
"#angular/core": "~5.0.0",
"#angular/forms": "~5.0.0",
"#angular/http": "~5.0.0",
"#angular/platform-browser": "~5.0.0",
"#angular/platform-browser-dynamic": "~5.0.0",
"#angular/router": "~5.0.0",
"#angular/upgrade": "~5.0.0",
"#progress/kendo-angular-buttons": "^2.0.0",
"#progress/kendo-angular-dateinputs": "^1.4.1",
"#progress/kendo-angular-dialog": "^1.3.0",
"#progress/kendo-angular-dropdowns": "^1.2.2",
"#progress/kendo-angular-excel-export": "^1.0.4",
"#progress/kendo-angular-grid": "^1.6.0",
"#progress/kendo-angular-inputs": "^1.3.3",
"#progress/kendo-angular-intl": "^1.3.0",
"#progress/kendo-angular-l10n": "^1.0.5",
"#progress/kendo-data-query": "^1.1.0",
"#progress/kendo-drawing": "^1.4.0",
"#progress/kendo-theme-default": "^2.43.2",
"angular2-jwt": "^0.2.3",
"angular2-moment": "^1.7.0",
"angular2-toaster": "^4.0.1",
"animate.css": "3.5.2",
"awesome-bootstrap-checkbox": "1.0.0",
"bootstrap": "4.0.0-beta",
"cldr-data": "^32.0.0",
"core-js": "^2.4.1",
"font-awesome": "4.7.0",
"glyphicons-halflings": "1.9.0",
"ng2-redux": "^5.1.2",
"ngx-bootstrap": "2.0.0-beta.5",
"pace": "git://github.com/HubSpot/pace.git#v0.7.7",
"popper.js": "1.12.5",
"redux": "^3.7.2",
"reflect-metadata": "0.1.10",
"rxjs": "^5.5.0",
"tassign": "^1.0.0",
"widgster": "0.0.3",
"zone.js": "^0.8.4"
There was an issue with the DropDownList losing the value on blur, but it is fixed in the latest version of the DropDowns package:
DOCS Changelog
Upgrading to the latest versions of the Kendo UI for Angular packages should resolve the described problem.

Resources