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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: polymer_1.0.4/bower_components/paper-dialog-scrollable/test/paper-dialog-scrollable.html

Issue 1205703007: Add polymer 1.0 to npm_modules (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Renamed folder to 1.0.4 Created 5 years, 6 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 | « polymer_1.0.4/bower_components/paper-dialog-scrollable/test/index.html ('k') | polymer_1.0.4/bower_components/paper-dialog/.bower.json » ('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 @license
4 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
5 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
6 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
7 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
8 Code distributed by Google as part of the polymer project is also
9 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
10 -->
11 <html>
12 <head>
13
14 <title>paper-dialog-scrollable tests</title>
15
16 <meta charset="utf-8">
17 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
18 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initia l-scale=1, user-scalable=yes">
19
20 <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
21
22 <script src="../../web-component-tester/browser.js"></script>
23 <script src="../../test-fixture/test-fixture-mocha.js"></script>
24
25 <link rel="import" href="../../test-fixture/test-fixture.html">
26 <link rel="import" href="../paper-dialog-scrollable.html">
27
28 <link rel="import" href="../../iron-flex-layout/classes/iron-flex-layout.htm l">
29
30 <style>
31 .fixed-height {
32 height: 400px;
33 }
34 </style>
35
36 </head>
37 <body>
38
39 <test-fixture id="basic">
40 <template>
41 <section class="fixed-height layout vertical">
42 <div class="header">Header</div>
43 <paper-dialog-scrollable class="flex">
44 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
45 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
46 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
47 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
48 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
49 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
50 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
51 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
52 </paper-dialog-scrollable>
53 <div class="footer">Footer</div>
54 </section>
55 </template>
56 </test-fixture>
57
58 <test-fixture id="only-child">
59 <template>
60 <section class="fixed-height layout vertical">
61 <paper-dialog-scrollable class="flex">
62 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
63 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
64 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
65 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
66 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
67 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
68 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
69 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim ven iam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo con sequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum do lore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, s unt in culpa qui officia deserunt mollit anim id est laborum.</p>
70 </paper-dialog-scrollable>
71 </section>
72 </template>
73 </test-fixture>
74
75 <test-fixture id="short">
76 <template>
77 <section class="fixed-height layout vertical">
78 <div class="header">Header</div>
79 <paper-dialog-scrollable class="flex">
80 <p>Hello world!</p>
81 </paper-dialog-scrollable>
82 <div class="footer">Footer</div>
83 </section>
84 </template>
85 </test-fixture>
86
87 <script>
88
89 function runAfterScroll(node, scrollTop, callback) {
90 var timeout = function() {
91 node.scrollTop = scrollTop;
92 if (node.scrollTop === scrollTop) {
93 // there seems to be no good way to wait for pseudoelement styling t o apply and
94 // chrome takes a while before getComputedStyle returns the correct values
95 setTimeout(function() {
96 callback();
97 }, 250);
98 } else {
99 setTimeout(timeout, 10);
100 }
101 };
102 node.scrollTop = scrollTop;
103 setTimeout(timeout);
104 }
105
106 suite('basic', function() {
107
108 test('shows top divider if scrolled', function(done) {
109 var container = fixture('basic');
110 var scrollable = Polymer.dom(container).querySelector('paper-dialog-sc rollable');
111 setTimeout(function() {
112 runAfterScroll(scrollable.scrollTarget, 10, function() {
113 assert.ok(getComputedStyle(scrollable, '::before').content, '::bef ore has content');
114 done();
115 });
116 }, 10);
117 });
118
119 test('shows bottom divider if scrollable', function(done) {
120 var container = fixture('basic');
121 setTimeout(function() {
122 var scrollable = Polymer.dom(container).querySelector('paper-dialog- scrollable');
123 requestAnimationFrame(function() {
124 assert.ok(getComputedStyle(scrollable, '::after').content, '::afte r has content');
125 done();
126 });
127 }, 10);
128 });
129
130 test('hides bottom divider if scrolled to bottom', function(done) {
131 var container = fixture('basic');
132 var scrollable = Polymer.dom(container).querySelector('paper-dialog-sc rollable');
133 setTimeout(function() {
134 runAfterScroll(scrollable.scrollTarget, scrollable.scrollTarget.scro llHeight - scrollable.scrollTarget.offsetHeight, function() {
135 var content = getComputedStyle(scrollable, '::after').content;
136 assert.ok(!content || content === 'none', '::after does not have c ontent');
137 done();
138 });
139 }, 10);
140 });
141
142 test('does not show dividers if scrolled and only child', function(done) {
143 var container = fixture('only-child');
144 var scrollable = Polymer.dom(container).querySelector('paper-dialog-sc rollable');
145 setTimeout(function() {
146 runAfterScroll(scrollable.scrollTarget, 10, function() {
147 var contentBefore = getComputedStyle(scrollable, '::before').conte nt;
148 assert.ok(!contentBefore || contentBefore === 'none', '::before do es not have content');
149 var contentAfter = getComputedStyle(scrollable, '::after').content ;
150 assert.ok(!contentAfter || contentAfter === 'none', '::after does not have content');
151 done();
152 });
153 }, 10);
154 });
155
156 test('does not show bottom divider if not scrollable', function(done) {
157 var container = fixture('short');
158 setTimeout(function() {
159 var scrollable = Polymer.dom(container).querySelector('paper-dialog- scrollable');
160 var contentAfter = getComputedStyle(scrollable, '::after').content;
161 assert.ok(!contentAfter || contentAfter === 'none', '::after does no t have content');
162 done();
163 }, 10);
164 });
165
166 });
167
168 </script>
169
170 </body>
171 </html>
OLDNEW
« no previous file with comments | « polymer_1.0.4/bower_components/paper-dialog-scrollable/test/index.html ('k') | polymer_1.0.4/bower_components/paper-dialog/.bower.json » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698