OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <style> |
| 3 body { |
| 4 height: 2000px; |
| 5 width: 2000px; |
| 6 } |
| 7 </style> |
| 8 |
| 9 <div id='console'></div> |
| 10 <script src="../../resources/js-test.js"></script> |
| 11 <script> |
| 12 window.jsTestIsAsync = true; |
| 13 description('This test verifies that navigating to entries created by ' + |
| 14 'pushState or replaceState correctly restores scroll position ' + |
| 15 'correctly and respects "scrollRestoration" flag.'); |
| 16 |
| 17 var tests = { |
| 18 '#1': {type: 'push', expectedScroll: [50, 100]}, |
| 19 '#2': {type: 'replace', expectedScroll: [100, 200]}, |
| 20 '#3': {type: 'push', expectedScroll: [150, 300], options: {scrollRestoratio
n: 'auto'}}, |
| 21 '#4': {type: 'replace', expectedScroll: [200, 400], options: {scrollRestoratio
n: 'auto'}}, |
| 22 /* Scroll position should not be restored for these two. */ |
| 23 // TODO(majidvp): uncomment these test cases once chromium side CL (https://cr
rev.com/959783003) lands |
| 24 // '#5': {type: 'push', expectedScroll: [0, 0], options: {scrollRestora
tion: 'manual'}}, |
| 25 // '#6': {type: 'replace', expectedScroll: [0, 0], options: {scrollRestora
tion: 'manual'}} |
| 26 }; |
| 27 |
| 28 // Navigation steps: |
| 29 // 1. Create a history entry using pushState then scroll |
| 30 // 2. Create a history entry and replace it then scroll |
| 31 // 3-6. Repeat 1 & 2 with different option values |
| 32 // 7. Navigate away and come back |
| 33 // 8-13. Verify 6 to 1 and keep navigating back |
| 34 function handleNavigation() { |
| 35 if (window.name !== 'verification phase') { |
| 36 for (var key in tests) { |
| 37 var test = tests[key]; |
| 38 var args = [{key: key}, '', key]; |
| 39 if ('options' in test) |
| 40 args.push(test.options); |
| 41 |
| 42 if (test.type == 'push') { |
| 43 history.pushState.apply(history, args); |
| 44 } else { |
| 45 history.pushState(null, '', key); |
| 46 history.replaceState.apply(history, args); |
| 47 } |
| 48 |
| 49 window.scrollBy(50, 100); |
| 50 } |
| 51 |
| 52 setTimeout(function() { |
| 53 window.name = 'verification phase'; |
| 54 window.location.href = 'resources/empty-document-goes-back.html'; |
| 55 }, 0); |
| 56 } else { |
| 57 var key = location.hash, |
| 58 test = tests[key]; |
| 59 |
| 60 debug('verifying ' + key); |
| 61 shouldBeEqualToString('history.state.key', '' + key); |
| 62 shouldBe('document.body.scrollLeft', test.expectedScroll[0].toString()); |
| 63 shouldBe('document.body.scrollTop', test.expectedScroll[1].toString()); |
| 64 |
| 65 if (key !== '#1') { |
| 66 window.history.back(); |
| 67 } else { |
| 68 window.name = ''; |
| 69 finishJSTest(); |
| 70 } |
| 71 } |
| 72 } |
| 73 |
| 74 window.addEventListener('pageshow', handleNavigation); |
| 75 window.addEventListener('hashchange', handleNavigation); |
| 76 </script> |
OLD | NEW |