Permalink
Browse files

Offset: fix iframe scrollTop/Left test for IE8 and iPhone

* IE8 need a doctype, otherwise IE will scroll it, but will
  still show old values. It wasn't noticable before, since IE8 will
  update values if in the dev tools you swtich to "Quirks mode"
  and then back again, then this tab will always show the correct values
  even if you update it

* iPhone resize the iframe by its content regardless of
  the width, height values, meaning it's not possible to scroll
  the iframe only its parent element

Ref ae30fb6
  • Loading branch information...
markelog committed Dec 24, 2014
1 parent d632699 commit 62a333e0646d3011377ed13a6fcfbb08e91e2bef
Showing with 22 additions and 8 deletions.
  1. +22 −8 test/unit/offset.js
View
@@ -550,17 +550,31 @@ test("fractions (see #7730 and #7885)", function() {
test("iframe scrollTop/Left (see gh-1945)", function() {
expect( 2 );
- // Tests scrollTop/Left with iframes
var ifDoc = jQuery( "#iframe" )[ 0 ].contentDocument;
- jQuery( "#iframe" ).css( "width", "50px" ).css( "height", "50px" );
- ifDoc.write( "<div style='width: 1000px; height: 1000px;'></div>" );
- ifDoc.close();
- jQuery( ifDoc ).scrollTop( 200 );
- jQuery( ifDoc ).scrollLeft( 500 );
+ // iPhone resize the iframe by its content
+ // meaning it's not possible to scroll the iframe only its parent element
+ if ( /iphone os/i.test( navigator.userAgent ) ) {
+ equal( true, true, "iPhone doesn't scroll the iframes" );
+ equal( true, true, "iPhone doesn't scroll the iframes" );
- equal( jQuery( ifDoc ).scrollTop(), 200, "$($('#iframe')[0].contentDocument).scrollTop()" );
- equal( jQuery( ifDoc ).scrollLeft(), 500, "$($('#iframe')[0].contentDocument).scrollLeft()" );
+ } else {
+ // Tests scrollTop/Left with iframes
+ jQuery( "#iframe" ).css( "width", "50px" ).css( "height", "50px" );
+
+ // Support: IE8
+ // Need a doctype, otherwise IE will scroll it but will still show old values
+ ifDoc.write( "<!DOCTYPE><div style='width: 1000px; height: 1000px;'></div>" );

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol Dec 26, 2014

Member

Why not write the correct DOCTYPE? (i.e. <!DOCTYPE html>).

@mgol

mgol Dec 26, 2014

Member

Why not write the correct DOCTYPE? (i.e. <!DOCTYPE html>).

This comment has been minimized.

Show comment
Hide comment
@markelog

markelog Dec 26, 2014

Member

And you don't feel weird that there is no body or head elements? But doctype, yeah, we gotta fix this right away :-).

This is minimum requirement for the test.

@markelog

markelog Dec 26, 2014

Member

And you don't feel weird that there is no body or head elements? But doctype, yeah, we gotta fix this right away :-).

This is minimum requirement for the test.

This comment has been minimized.

Show comment
Hide comment
@scottgonzalez

scottgonzalez Dec 26, 2014

Member

At least fixing the doctype guarantees we're in standards mode, which is a requirement for jQuery. Technically <head> and <body> are optional, though if we want a fully valid page, there should be a <title>.

@scottgonzalez

scottgonzalez Dec 26, 2014

Member

At least fixing the doctype guarantees we're in standards mode, which is a requirement for jQuery. Technically <head> and <body> are optional, though if we want a fully valid page, there should be a <title>.

This comment has been minimized.

Show comment
Hide comment
@markelog

markelog Dec 26, 2014

Member

It's already guarantees that, by our tests, but you could add it if you like, the hard part is done anyway.

But if you do that, could you add it to every iframe test we have, so we could fix them all in once?

@markelog

markelog Dec 26, 2014

Member

It's already guarantees that, by our tests, but you could add it if you like, the hard part is done anyway.

But if you do that, could you add it to every iframe test we have, so we could fix them all in once?

This comment has been minimized.

Show comment
Hide comment
@arthurvr

arthurvr Dec 26, 2014

Member

Also: uppercase doctype? Isn't that against the style guide?

@arthurvr

arthurvr Dec 26, 2014

Member

Also: uppercase doctype? Isn't that against the style guide?

+
+ // Support: IE8
+ ifDoc.close();
+
+ jQuery( ifDoc ).scrollTop( 200 );
+ jQuery( ifDoc ).scrollLeft( 500 );
+
+ equal( jQuery( ifDoc ).scrollTop(), 200, "$($('#iframe')[0].contentDocument).scrollTop()" );
+ equal( jQuery( ifDoc ).scrollLeft(), 500, "$($('#iframe')[0].contentDocument).scrollLeft()" );
+ }
});
})();

0 comments on commit 62a333e

Please sign in to comment.