Side navigation
#12426 closed bug (notabug)
Opened August 29, 2012 09:02PM UTC
Closed September 12, 2012 10:01AM UTC
Last modified November 22, 2012 05:20PM UTC
jquery 1.8.0 $(window).height() and .width() is broken and does not work correctly (Firefox, IE8)
| Reported by: | Wikinaut | Owned by: | Wikinaut |
|---|---|---|---|
| Priority: | undecided | Milestone: | None |
| Component: | dimensions | Version: | 1.8.0 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
as mentioned in https://github.com/jquery/jquery/pull/764#issuecomment-8120831 the function of $(window) is broken compared to jquery 1.7.2
How to reproduce
See code in http://dpaste.com/hold/793316/
When running 1.7.2 everything is perfect.
When running 1.8.0 IE8 returns $(window).height() and .width() == 0 (zero)
When running 1.8.0 Firefox returns $(window).height()= 8 or random values, and .width() okay (zero)
So please check your 1.8.0 code for $(window). The jquery 1.8.0 is broken !
See http://stackoverflow.com/questions/1860524/javascript-how-to-find-out-width-and-height-of-viewpoint-in-browser-window for a *working* solution, tested with Safari, Firefox 14, Firefox 15, IE8, Firefox 10 ESR
Attachments (0)
Change History (18)
Changed August 29, 2012 09:07PM UTC by comment:1
Changed August 29, 2012 09:09PM UTC by comment:2
| component: | unfiled → dimensions |
|---|---|
| owner: | → Wikinaut |
| status: | new → pending |
Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.
Additionally, be sure to test against the jQuery git("edge") version to ensure the issue still exists. To get you started, use this boilerplate: http://jsfiddle.net/FrKyN/. Open the link and click to "Fork" (in the top menu) to get started.
Changed August 29, 2012 09:10PM UTC by comment:3
That's cool, I double checked the code there.
It's in Quirks mode. The document type is invalid. Did you intend that?
Changed August 29, 2012 09:13PM UTC by comment:4
Just to clarify, in that thread I asked.
@Wikinaut this isn't the place to report anything. Can you go to our bug tracker, http://bugs.jquery.com and provide a test case? Be sure you're not in Quirks mode, which jQuery has never supported.
Honestly. A couple of years ago I checked with John Resig to confirm that we never ever supported Quirks. Yes, sometimes things kinda sorta work. But we never supported Quirks mode, and have never run unit tests in them.
Changed August 29, 2012 10:57PM UTC by comment:5
| resolution: | → invalid |
|---|---|
| status: | pending → closed |
Changed August 30, 2012 12:43PM UTC by comment:6
| resolution: | invalid |
|---|---|
| status: | closed → reopened |
Changed August 30, 2012 12:44PM UTC by comment:7
| status: | reopened → pending |
|---|
We need a test case that does not use Quirks that demonstrates this problem.
Changed August 31, 2012 02:14AM UTC by comment:8
So, GitHub's recent notifications shuffle means I wasn't getting notifications from the Pull Request thread, so I'm just joining the conversation. Sorry, I'm late to the game. I'm the engineer who wrote the patch that allegedly broke IE8.
I wrote out this simple test example (fair warning, it uses an alert box :P):
http://jsfiddle.net/farmdawgnation/59XbC/
If what you're saying is true, then I should be getting different results in Firefox and IE8 when this code runs under jQuery 1.7.2 and jQuery 1.8.0 (by flipping the select drop down). It would seem that jQuery 1.7.2, jQuery 1.8.0, and jQuery Edge all yield the same results for $(window).height() under IE8 and Firefox when standards mode is in use.
I can only reproduce the behavior you're describing by running IE8 in quirks mode. I, too, suspect that is the cause of your troubles.
Changed September 02, 2012 07:17PM UTC by comment:9
Google Chrome + jQuery 1.8.1, a window with a vertical scrollbar:
>> window.innerHeight --> 500 (the viewport height)
>> $(window).height --> 1000 (the document height)
Can't reproduce in jsfiddle, since I can't get it to show a scrollbar on the window.
Changed September 05, 2012 06:40PM UTC by comment:10
Does my updated jsfiddle represent what you're testing? http://jsfiddle.net/59XbC/1/
I manually set the height of the body such that the results pane scrolls, and I'm still seeing the same values for window.innerHeight and $(window).height().
Changed September 05, 2012 07:49PM UTC by comment:11
This is definitely the Quirks mode issue. I see no reason to continue having this continue be pending or open. Can we please close?
Changed September 06, 2012 06:08AM UTC by comment:12
| status: | pending → new |
|---|
I am checking this currently. IE8 shows "console undefined" for the console.log() expression.
Should I replace this with an alert, or what is your recommendation for testing with IE8 ?
Changed September 08, 2012 12:02AM UTC by comment:13
Ah, sorry, I updated that jsfiddle because ~~multiple~~ any alerts are annoying. But yes, for testing with IE8 change those console logs to alerts.
Changed September 08, 2012 01:50PM UTC by comment:14
| status: | new → pending |
|---|
Bring up F12 Developer Tools in IE8, console.log is only available in IE8 while dev tools are open.
Still waiting on a test case that doesn't require Quirks to fail.
Changed September 12, 2012 06:51AM UTC by comment:15
| status: | pending → new |
|---|
Problem is solved now.
Report:
- I was until now fully unaware of Quirks mode, pls. apologize.
- I already knew from several jQuery reports, that jQuery never aimed to support Quirks mode.
- Until today I always used this document type declaration
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- I found that IE8 is bitchy and requires this form
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- My problem is reproducible in that way that a change between these two dtds makes the problem of $(window).height().width() not working in IE8 apparent or not:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">- does not work
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">- works
''Solution: Everyone with (such) jquery problems should be directly pointed to double-check whether the dtd is really
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">'''
You can close this bug now.
Changed September 12, 2012 10:01AM UTC by comment:16
| resolution: | → notabug |
|---|---|
| status: | new → closed |
Changed November 22, 2012 03:00PM UTC by comment:17
#12942 is a duplicate of this ticket.
Changed November 22, 2012 05:20PM UTC by comment:18
#12944 is a duplicate of this ticket.
remark:
a working code which DOES NOT use jquery 1.8.0 for the viewport size detection is here http://dpaste.com/hold/793319/