Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

(How) Can I set height properties on window, documentElement or body? #2843

Closed
DavidRicharz opened this issue Feb 17, 2020 · 2 comments
Closed

(How) Can I set height properties on window, documentElement or body? #2843

DavidRicharz opened this issue Feb 17, 2020 · 2 comments
Labels
layout Blocked on implementing a layout engine

Comments

@DavidRicharz
Copy link

DavidRicharz commented Feb 17, 2020 •
edited

How can I alter height/width element properties in jsdom? I don't see any setters and simply applying a value to a selected property won't work.

I realize this is not what we would do within a regular browser environment, but jsdom doesn't seem to implement any kind of height/width properties by itself. Simply adding elements to the jsdom constructor should increase height/width properties of the document.

I also found this "solution", but it only extends to document.documentElement and does not update any other nodes (body, p#content).

Minimal reproduction case

const { JSDOM } = require("jsdom");

const dom = new JSDOM('<!DOCTYPE html><p id="content">Some Elem with height </p>');

//without alteration
console.log(dom.window.document.body.querySelector('#content').clientHeight); // 0 There is no real height property

//simply trying to assign a value
dom.window.document.documentElement.clientHeight = 1234;
console.log(dom.window.document.documentElement.clientHeight); // 0

//using defineProperty
Object.defineProperty(dom.window.HTMLHtmlElement.prototype, 'clientWidth', {value: 1234});
console.log(dom.window.document.documentElement.clientWidth) // 1234
console.log(dom.window.document.body.clientWidth) // 0 
console.log(dom.window.document.documentElement.querySelector('#content').clientWidth) // 0
@domenic
Copy link
Member

domenic commented Mar 14, 2020

Simply adding elements to the jsdom constructor should increase height/width properties of the document.

Doing this would require implementing a layout system, which is not currently in our plans. The best you can do is use defineProperty to supply fake values. But, if you really want to get layed-out coordinates, you may be best off with a true headless browser, not with jsdom.

@domenic
Copy link
Member

domenic commented Mar 14, 2020

I'll dupe this into #135.

@domenic domenic closed this as completed Mar 14, 2020
@domenic domenic added the layout Blocked on implementing a layout engine label Mar 14, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
layout Blocked on implementing a layout engine
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@domenic @DavidRicharz