search

telerik / kendo-angular

Issue tracker - Kendo UI for Angular
http://www.telerik.com/kendo-angular-ui/
Other
467 stars 215 forks source link

Kendo UI break on angular 14 version? #3711

Closed kapilSoni101 closed 2 years ago

kapilSoni101 commented 2 years ago

I'm submitting a...

Current behavior

Kendo UI break on chrome Hi Team, I have implemented kendo-UI in the angular 14 but kendo UI totally break. can you please let me know why i got this issue.check below attached screenshot for reference

Expected behavior

UI working properly

Minimal reproduction of the problem with instructions

image

Environment

Package versions: { "name": "epoc", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "startplat": "ng serve platform-port --port=4201", "startpub": "ng serve publisher-port --port=4202", "startbiz": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng serve business-port --port=4203", "startcust": "ng serve customer-port --port=4204", "startvend": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng serve vendor-port --port=4205", "buildplat": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --build-optimizer --base-href=platform --project=platform-port --source-map=false --configuration=production", "buildpub": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --build-optimizer --base-href=publisher --project=publisher-port --source-map=false --configuration=production", "buildcust": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --base-href=customer --project=customer-port --source-map=false --configuration=production", "buildbiz": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --base-href=business --project=business-port --source-map=false --configuration=production", "buildvend": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --base-href=vendor --project=vendor-port" }, "private": true, "dependencies": { "@agm/core": "^1.0.0-beta.6", "@angular/animations": "^14.0.3", "@angular/cdk": "^8.0.0", "@angular/common": "^14.0.3", "@angular/compiler": "^14.0.3", "@angular/core": "^14.0.3", "@angular/forms": "^14.0.3", "@angular/platform-browser": "^14.0.3", "@angular/platform-browser-dynamic": "^14.0.3", "@angular/router": "^14.0.3", "@aspnet/signalr": "^1.1.4", "@ngx-translate/core": "^11.0.1", "@ngx-translate/http-loader": "^4.0.0", "@progress/kendo-angular-buttons": "^5.0.0", "@progress/kendo-angular-charts": "^6.0.1", "@progress/kendo-angular-common": "^1.0.0", "@progress/kendo-angular-dateinputs": "^4.0.0", "@progress/kendo-angular-dropdowns": "^4.0.0", "@progress/kendo-angular-excel-export": "^3.0.0", "@progress/kendo-angular-grid": "^4.1.1", "@progress/kendo-angular-inputs": "^6.0.0", "@progress/kendo-angular-intl": "^2.0.0", "@progress/kendo-angular-l10n": "^2.0.0", "@progress/kendo-angular-pdf-export": "^2.0.0", "@progress/kendo-angular-popup": "^3.0.0", "@progress/kendo-angular-upload": "^6.1.0", "@progress/kendo-data-query": "^1.0.0", "@progress/kendo-drawing": "^1.0.0", "@progress/kendo-licensing": "^1.2.2", "@progress/kendo-theme-default": "latest", "@types/moment-timezone": "^0.5.12", "@types/node": "^8.10.66", "bootstrap": "^3.3.7", "classlist.js": "^1.1.20150312", "croppie": "^2.6.4", "google-libphonenumber": "^3.2.2", "hammerjs": "^2.0.8", "jquery": "^3.4.1", "moment": "^2.24.0", "moment-timezone": "^0.5.25", "ng-lazyload-image": "^9.1.0", "ng-search-filter": "^1.1.0", "ng2-search-filter": "^0.5.1", "ngx-device-detector": "^1.3.9", "ngx-print": "^1.2.1", "ngx-toastr": "^14.0.0", "oidc-client": "^1.7.1", "stacktrace-js": "^2.0.0", "ts.validator.fluent": "^1.3.0", "tslib": "^2.4.0", "typescript-collections": "^1.3.2", "zone.js": "~0.11.5" }, "devDependencies": { "@angular-devkit/build-angular": "^14.0.3", "@angular-devkit/build-ng-packagr": "^0.801.3", "@angular/cli": "^14.0.3", "@angular/compiler-cli": "^14.0.3", "@angular/language-service": "^14.0.3", "@angular/localize": "^14.0.3", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/moment": "^2.13.0", "codelyzer": "^5.0.0", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~6.3.20", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "ng-packagr": "^14.0.2", "protractor": "~7.0.0", "ts-node": "~7.0.0", "tsickle": "^0.35.0", "tslint": "~6.1.3", "typescript": "~4.6.4" } }

Browser:

System:

Louspirit commented 2 years ago

Even using next version, I've got compatibility issues. Seems we have to wait for an Angular 14 compatible release.

 Could not resolve dependency:
npm ERR! peer @angular/animations@"^12.0.0 || ^13.0.0" from @progress/kendo-angular-buttons@8.0.0-next.202204131126
npm ERR! node_modules/@progress/kendo-angular-buttons
npm ERR!   @progress/kendo-angular-buttons@"next" from the root project
mbechev commented 2 years ago

Hi,

All Kendo UI for Angular packages are compatible with Angular v14, but in their latest versions. This can be seen in the ChangeLog section of each package: https://www.telerik.com/kendo-angular-ui/components/grid/changelog/

Currently installed Kendo package versions are out of date and don't support Angular v14. Update them accordingly: https://www.telerik.com/kendo-angular-ui/components/installation/up-to-date/

If any further assistance is required for this case, please open a support ticket.

Louspirit commented 2 years ago

But isn't next supposed to be the latest version, only that it's ivy-compatible @mbechev?

kapilSoni101 commented 2 years ago

@mbechev sir i agree with you with but I am facing some issue on angular 8 version also.so why it's got same issue on angular 8?

mbechev commented 2 years ago

Using ng add command will atuomatically install the latest version of a component: https://www.telerik.com/kendo-angular-ui/components/grid/get-started/#toc-quick-setup-with-angular-cli

@next is no longer needed (it was used to install the packages in the past, before releasing them) - https://github.com/telerik/kendo-angular/issues/3502. Now all packages are Ivy compatible in their latest versions.

It is recommended to install and use the versions listed in the ChangeLog section of each package.

Angular v8 is no longer supported by the framework and Kendo UI suite: https://www.telerik.com/kendo-angular-ui/components/installation/requirements/#toc-angular

If you are experiencing any specific issue, open a support ticket. The current report is closed since the report is for bug reports only.