Primeng: TypeError: Cannot assign to read only property 'scrollHeight' of object

Created on 26 Aug 2017  路  5Comments  路  Source: primefaces/primeng

I am receiving the following error while trying execute Angular test case(Karma/Jasmine).

TypeError: Cannot assign to read only property 'scrollHeight' of object '[object HTMLElement]' at EmulatedEncapsulationDomRenderer2.DefaultDomRenderer2.setProperty (webpack:///~/@angular/platform-browser/@angular/platform-browser.es5.js:2923:0 <- src/test.ts:32458:18)

HTML Element :

The test case works fine if the scrollHeight set to a constant like 100px. But externalizing it with myHeight="100px" does not work

Note: I do not get this error in my application as shown in the preview, this happens only in unit test case when i try to create an instance of the component(fixture.detectChanges).

https://plnkr.co/edit/VYE1AybiMNFdGLYOh5zn?p=preview

Current behavior
Throws above error

Expected behavior
Should not throw error since it works in app.

Minimal reproduction of the problem with instructions
Create basic test case of the app.component.cs and it will fail with the above error.

  • Angular version: 4.0.X

  • PrimeNG version: 4.1.0-rc.3

All 5 comments

Unable to replicate.

In my case helped
scrollHeight="60vh"
instead
[scrollHeight]="'60vh'" (or any other property instead of strict value)

What if I want to externalize the value of scrollHeight? How did you get 60vh? In my case I am calculating when page resized and assigning this value to scrollHeight! This fails when I write test cases for this..

'scrollHeight' is an element attribute that is read-only. https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight

Changing the @Input() scrollHeight: string to @Input() bodyScrollHeight: string (or anything that isn't an element attribute) will fixed this issue.

This error occurs in unit tests when TableModule hasn't been imported to the TestBed (this was the case for me anyhow using primeng v11 & Angular v11)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

miresk picture miresk  路  3Comments

philly-vanilly picture philly-vanilly  路  3Comments

papiroca-tm picture papiroca-tm  路  3Comments

jisqaqov picture jisqaqov  路  3Comments

SchneMa picture SchneMa  路  3Comments