Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(18)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: bower_components/core-overlay/tests/html/core-overlay-scroll.html

Issue 786953007: npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Created 5 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « bower_components/core-overlay/tests/html/core-overlay-positioning-margin.html ('k') | bower_components/core-overlay/tests/js/htmltests.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!doctype html>
2 <!--
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 -->
10 <html>
11 <head>
12 <title>core-overlay</title>
13 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum- scale=1.0">
14 <script src="../../../platform/platform.js"></script>
15 <script src="../../../polymer-test-tools/chai/chai.js"></script>
16 <script src="../../../polymer-test-tools/htmltest.js"></script>
17 <link rel="import" href="../../../core-transition/core-transition-css.html">
18 <link rel="import" href="../../core-overlay.html">
19 <style>
20 core-overlay {
21 width: 300px;
22 border: 1px solid black;
23 margin: 10px;
24 overflow: auto !important;
25 }
26
27 #content {
28 overflow: auto;
29 }
30 </style>
31 </head>
32 <body fullbleed unresolved>
33 <template is="auto-binding">
34 <core-overlay id="simple">
35 <div>Lots of Content that might overflow the overlay!</div>
36 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
37 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
38 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
39 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
40 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
41 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
42 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
43 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
44 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
45 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
46 </core-overlay>
47
48 <core-overlay id="sectioned" vertical layout sizingTarget="{{$.content}}">
49 <header>Stuff on top</header>
50 <section id="content">
51 <div>Lots of Content that might overflow the overlay!</div>
52 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
53 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
54 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
55 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
56 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
57 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
58 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
59 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
60 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
61 <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiu smod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam , quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo conseq uat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolor e eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
62 </section>
63 <footer>Stuff on bottom</footer>
64 </core-overlay>
65 </template>
66 <script>
67 addEventListener('template-bound', function(e) {
68 // setup
69 var simple = document.querySelector('#simple');
70 var sectioned = document.querySelector('#sectioned');
71
72 function testWhenOpen(element, test, next) {
73 var l1 = function() {
74 test();
75 element.async(function() {
76 element.opened = false;
77 }, null, 1);
78 };
79 var l2 = function() {
80 element.removeEventListener('core-overlay-open-completed', l1);
81 element.removeEventListener('core-overlay-close-completed', l2);
82 next();
83 };
84 element.addEventListener('core-overlay-open-completed', l1);
85 element.addEventListener('core-overlay-close-completed', l2);
86 element.opened = true;
87 }
88
89 asyncSeries([
90 // scrolling overlay does not overflow
91 function(next) {
92 testWhenOpen(simple, function() {
93 var rect = simple.getBoundingClientRect();
94 chai.assert.ok(0 < rect.top + 10, 'overlay constrained to window siz e');
95 chai.assert.ok(0 < rect.left + 10, 'overlay constrained to window si ze');
96 chai.assert.ok(window.innerWidth >= rect.right + 10, 'overlay constr ained to window size');
97 chai.assert.ok(window.innerHeight >= rect.bottom + 10, 'overlay cons trained to window size');
98 }, next);
99 },
100 // scrolling overlay does not overflow
101 function(next) {
102 testWhenOpen(sectioned, function() {
103 var rect = sectioned.getBoundingClientRect();
104 chai.assert.ok(0 < rect.top + 10, 'overlay constrained to window siz e');
105 chai.assert.ok(0 < rect.left + 10, 'overlay constrained to window si ze');
106 chai.assert.ok(window.innerWidth >= rect.right + 10, 'overlay constr ained to window size');
107 chai.assert.ok(window.innerHeight >= rect.bottom + 10, 'overlay cons trained to window size');
108 }, next);
109 },
110 // positioned scrolling overlay does not overflow
111 function(next) {
112 sectioned.style.top = sectioned.style.right = '';
113 sectioned.style.left = '300px';
114 sectioned.style.bottom = '200px'
115 testWhenOpen(sectioned, function() {
116 var rect = sectioned.getBoundingClientRect();
117 chai.assert.ok(0 < rect.top + 10, 'overlay constrained to window siz e');
118 chai.assert.ok(0 < rect.left + 10, 'overlay constrained to window si ze');
119 chai.assert.ok(window.innerWidth >= rect.right + 10, 'overlay constr ained to window size');
120 chai.assert.ok(window.innerHeight >= rect.bottom + 10, 'overlay cons trained to window size');
121 }, next);
122 }
123 ], done);
124 });
125 </script>
126 </body>
127
128 </html>
129
130 </html>
OLDNEW
« no previous file with comments | « bower_components/core-overlay/tests/html/core-overlay-positioning-margin.html ('k') | bower_components/core-overlay/tests/js/htmltests.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698