Bug Tracker

Ticket #12426 (closed bug: notabug)

Opened 2 years ago

Last modified 20 months ago

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:
Blocking: Blocked by:

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

Change History

comment:1 Changed 2 years ago by Wikinaut

remark:

a working code which DOES NOT use jquery 1.8.0 for the viewport size detection is here  http://dpaste.com/hold/793319/

comment:2 Changed 2 years ago by timmywil

  • Owner set to Wikinaut
  • Status changed from new to pending
  • Component changed from unfiled to dimensions

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.

comment:3 Changed 2 years ago by dmethvin

That's cool, I double checked the code there.

It's in Quirks mode. The document type is invalid. Did you intend that?

comment:4 Changed 2 years ago by dmethvin

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.

 http://docs.jquery.com/Won't_Fix

comment:5 Changed 2 years ago by mikesherov

  • Status changed from pending to closed
  • Resolution set to invalid

comment:6 Changed 2 years ago by dmethvin

  • Status changed from closed to reopened
  • Resolution invalid deleted

comment:7 Changed 2 years ago by dmethvin

  • Status changed from reopened to pending

We need a test case that does not use Quirks that demonstrates this problem.

comment:8 Changed 23 months ago by farmdawgnation

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.

comment:9 Changed 23 months ago by mtkopone

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.

comment:10 Changed 23 months ago by farmdawgnation

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

comment:11 Changed 23 months ago by mikesherov

This is definitely the Quirks mode issue. I see no reason to continue having this continue be pending or open. Can we please close?

comment:12 Changed 23 months ago by Wikinaut

  • Status changed from pending to 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 ?

comment:13 Changed 23 months ago by farmdawgnation

Ah, sorry, I updated that jsfiddle because multiple any alerts are annoying. But yes, for testing with IE8 change those console logs to alerts.

comment:14 Changed 23 months ago by dmethvin

  • Status changed from new to 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.

comment:15 Changed 23 months ago by Wikinaut

  • Status changed from pending to 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.

comment:16 Changed 23 months ago by mikesherov

  • Status changed from new to closed
  • Resolution set to notabug

comment:18 Changed 20 months ago by dmethvin

#12942 is a duplicate of this ticket.

comment:19 Changed 20 months ago by dmethvin

#12944 is a duplicate of this ticket.

Note: See TracTickets for help on using tickets.