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
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)