Open Mangdar opened 4 years ago
Same here, it started happening after upgrading to version 9. For the moment you can roll back to 8.0.0-beta.2 to make it work with angular universal. It shows a warning though, but at least it doesn't break:
[Violation] Added non-passive event listener to a scroll-blocking 'wheel' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
Any news on this?
hi @blasco , I haven't got a chance to look into this. If you know the solution, feel free to submit a PR.
@bfwg Thank you for the great work. Unfortunately I have no clue what is causing the issue, for the moment I'm staying with 8.0.0-beta.2 version.
I'm getting this issue after upgrading to Angular 10 also, mind you, I couldn't tell you if it was working previously as I've also recently migrated to using SSR / Universal, so it could have been there for v8.x too.
I've done a bit of investigation, and this occurs whenever I include a ViewChild
in my component as follows:
@ViewChild('techList', { read: DragScrollComponent, static: true })
public techList: DragScrollComponent;
I need this to be able to access currIndex
for implementing custom scrolling.
Full error below:
D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:148026
Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__metadata"])("design:paramtypes", [WheelEvent]),
^
ReferenceError: WheelEvent is not defined
at Module../node_modules/ngx-drag-scroll/__ivy_ngcc__/fesm2015/ngx-drag-scroll.js (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:148026:84)
at __webpack_require__ (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:20:30)
at Module../src/app/shared/tech-list/tech-list.component.ts (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:173198:73)
at __webpack_require__ (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:20:30)
at Module../src/app/pages/home/home.component.ts (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:170431:95)
at __webpack_require__ (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:20:30)
at Module../src/app/app-routing.module.ts (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:168308:84)
at __webpack_require__ (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:20:30)
at Module../src/app/app.module.ts (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:168754:77)
at __webpack_require__ (D:\Git\Personal\ShadowMosesWebsite\src\SMD.Web\dist\smdweb\server\main.js:20:30)
A server error has occurred.
node exited with 1 code.
Any updates on this? Thank you again
@blasco I'll try to find time today and take a look. Can you provide a piece of code demo using https://plnkr.co/, or just steps to reproduce this?
We've got the same issue with 9.0.0-beta.4, works with 8.0.0-beta.2.
Great package btw thank you for your work !
@bfwg Sorry I haven't been able to set up a demo. The steps to reproduce are simple, just deploy a Angular Universal app and try to use the component, it will fail with the latest version.
I got the same issue.
Any progress with this, is it solved with angular 11?
I think the solution could be to use this to isolate the browser dependent code:
import { ..., PLATFORM_ID, ... } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
constructor(
@Inject(PLATFORM_ID) private platformId: Object,
){
if (isPlatformBrowser(this.platformId)) {
// MouseEvent code
}
}
@blasco do you have a working solution?
@bfwg Unfortunately not, I'm just stuck with version 8.0.0 which seems to work for Angular 11 and SSR. This is the best gallery solution for angular out there, I wish you could have more support to fix these small issues.
Hi, has this been solved by any chance? Is it safe to update to the latest version? Thank you in advance for your outstanding work!
hi @blasco , would you mind running dev:ssr on the example app and tell me what you see?
I am facing the same issue. EDIT: I can confirm, after I deleted this I can proceed without that error.
D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:171203 Object(tslib__WEBPACK_IMPORTED_MODULE_0["metadata"])("design:paramtypes", [WheelEvent]), ^
ReferenceError: WheelEvent is not defined at Module../node_modules/ngx-drag-scroll/ivy_ngcc/fesm2015/ngx-drag-scroll.js (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:171203:84) at webpack_require (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:26:30) at Module../src/app/sharing/sharing.module.ts (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:195456:73) at webpack_require (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:26:30) at Module../src/app/app.module.ts (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:193446:82) at webpack_require (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:26:30) at Module../src/app/app.server.module.ts (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:193565:69) at webpack_require (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:26:30) at Module../src/main.server.ts (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:200059:80) at webpack_require (D:\Workspace\Frontend\whitesidev2\dist\whitesidev2\server\main.js:26:30)