Skip to content
This repository was archived by the owner on Dec 16, 2025. It is now read-only.

Commit 764a000

Browse files
ebidelebidel
committed
Merge pull request #5 from googlecodelabs/fix4
Passing tests! Fixes #4
2 parents 102ca93 + 183179b commit 764a000

File tree

5 files changed

+113
-88
lines changed

5 files changed

+113
-88
lines changed

‎codelab-style.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<link rel="import" href="../paper-styles/color.html">
1818

1919
<dom-module id="codelab-style">
20-
<template>
20+
<template strip-whitespace>
2121
<style>
2222

2323
:root {

‎google-codelab-step.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@
5151
@demo demo/step.html
5252
-->
5353
<dom-module id="google-codelab-step">
54-
<template>
54+
<template strip-whitespace>
5555
<style include="shared-style"></style>
5656
<style include="step-style"></style>
5757
<style include="syntax-style"></style>

‎google-codelab-survey.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ <h4>How would rate your experience with Polymer?</h4>
4747
@demo demo/survey.html
4848
-->
4949
<dom-module id="google-codelab-survey">
50-
<template>
50+
<template strip-whitespace>
5151
<style include="shared-style">
5252
:host {
5353
display: block;

‎google-codelab.html‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@
5656
@demo demo/codelab.html
5757
-->
5858
<dom-module id="google-codelab">
59-
<template>
59+
<template strip-whitespace>
6060
<style include="shared-style"></style>
6161
<style include="codelab-style"></style>
6262

@@ -70,14 +70,14 @@
7070
<div drawer>
7171
<paper-menu id="toc" selected="{{selected}}"
7272
on-iron-select="_allowCodelabComplete">
73-
<template is="dom-repeat" items="{{steps}}">
73+
<template is="dom-repeat" items="{{steps}}" strip-whitespace>
7474
<paper-item class$="{{_tocItemClass(selected, index)}}">
7575
<i>{{item.step}}</i><span>{{item.label}}</span>
7676
</paper-item>
7777
</template>
7878
</paper-menu>
7979

80-
<template is="dom-if" if="{{feedbackLink}}">
80+
<template is="dom-if" if="{{feedbackLink}}" strip-whitespace>
8181
<div id="feedback">
8282
Did you find a mistake?
8383
<a target="_blank" href$="{{feedbackLink}}">Please file a bug</a>.
@@ -88,10 +88,10 @@
8888

8989
<paper-scroll-header-panel id="headerpanel" fixed main>
9090
<paper-toolbar>
91-
<template is="dom-if" if="{{_narrow}}">
91+
<template is="dom-if" if="{{_narrow}}" strip-whitespace>
9292
<paper-icon-button icon="menu" paper-drawer-toggle></paper-icon-button>
9393
</template>
94-
<template is="dom-if" if="{{!_narrow}}">
94+
<template is="dom-if" if="{{!_narrow}}" strip-whitespace>
9595
<paper-icon-button icon="arrow-back" on-tap="_goToHome"></paper-icon-button>
9696
</template>
9797
<h1 class="title">{{title}}</h1>
@@ -102,7 +102,8 @@ <h1 class="title">{{title}}</h1>
102102
</paper-toolbar>
103103

104104
<neon-animated-pages id="pages" selected="{{selected}}"
105-
on-iron-deselect="_onStepLeave">
105+
on-iron-deselect="_onStepLeave"
106+
on-iron-items-changed="_onStepsChanged">
106107
<content select="google-codelab-step"></content>
107108
</neon-animated-pages>
108109

@@ -115,14 +116,14 @@ <h1 class="title">{{title}}</h1>
115116
</paper-fab>
116117

117118
<div>
118-
<template is="dom-if" if="{{_showNextFab(selected, steps)}}">
119+
<template is="dom-if" if="{{_showNextFab(selected, steps)}}" strip-whitespace>
119120
<paper-fab icon="chevron-right" raised class="navbutton nextbutton"
120121
title="{{_nextFabTitle(selected)}}"
121122
on-tap="selectNext">
122123
</paper-fab>
123124
</template>
124125

125-
<template is="dom-if" if="{{_showDoneFab(selected, steps)}}">
126+
<template is="dom-if" if="{{_showDoneFab(selected, steps)}}" strip-whitespace>
126127
<paper-fab icon="done" raised class="navbutton donebutton"
127128
on-tap="_goToHome" title="Complete codelab">
128129
</paper-fab>
@@ -149,6 +150,11 @@ <h2>Would you like to resume where you left off?</h2>
149150
Polymer({
150151
is: 'google-codelab',
151152

153+
/**
154+
* Fired when the codelab steps have been fully initialized.
155+
* @event google-codelab-ready
156+
*/
157+
152158
/**
153159
* Fired when user advances a codelab step or goes backwards.
154160
* @event google-codelab-step
@@ -298,7 +304,7 @@ <h2>Would you like to resume where you left off?</h2>
298304
this._updateStepIndexFromUrl();
299305
},
300306

301-
attached: function() {
307+
_onStepsChanged: function() {
302308
var duration = 0;
303309
var steps = this.$.pages.items.map(function(item, i) {
304310
duration += item.duration;
@@ -308,6 +314,7 @@ <h2>Would you like to resume where you left off?</h2>
308314
this._setSteps(steps);
309315
this._setDuration(duration);
310316
this._updateRemaining();
317+
this.fire('google-codelab-ready', {steps: this.steps});
311318
},
312319

313320
/**
@@ -459,7 +466,10 @@ <h2>Would you like to resume where you left off?</h2>
459466
},
460467

461468
_isLastStep: function(stepIndex) {
462-
return !this.steps.length || stepIndex >= this.steps.length - 1;
469+
if (!this.steps.length) {
470+
return false;
471+
}
472+
return stepIndex >= this.steps.length - 1;
463473
},
464474

465475
_showDoneFab: function(stepIndex, steps) {

‎test/codelab.html‎

Lines changed: 90 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -94,29 +94,32 @@
9494
var events = collectEvents(window);
9595
var codelab = fixture('codelab');
9696

97-
assert.equal(codelab.selected, 0);
98-
assert.equal(codelab.duration, 5);
99-
assert.equal(codelab.remaining, '5 min remaining');
100-
assert.equal(codelab.feedbackLink, 'http://codelab.example.org');
101-
assert.equal(codelab.steps[0].step, 1);
102-
assert.equal(codelab.steps[1].step, 2);
97+
codelab.addEventListener('google-codelab-ready', function(e) {
98+
assert.equal(codelab.selected, 0);
99+
assert.equal(codelab.duration, 5);
100+
assert.equal(codelab.remaining, '5 min remaining');
101+
assert.equal(codelab.feedbackLink, 'http://codelab.example.org');
102+
assert.equal(codelab.steps[0].step, 1);
103+
assert.equal(codelab.steps[1].step, 2);
103104

104-
assert.equal(codelab.querySelector('h1').textContent, 'Test title');
105+
assert.equal(codelab.querySelector('h1').textContent, 'Test title');
106+
107+
// TOC dom-repeat needs another microtask to render
108+
async.nextTick(function() {
109+
assert(codelab.querySelector('.prevbutton').disabled, 'prev fab is not disabled');
110+
assert(!codelab.querySelector('.prevbutton').hidden, 'prev fab is hidden');
111+
assert(!codelab.querySelector('.nextbutton').disabled, 'next fab is disabled');
112+
assert(!codelab.querySelector('.nextbutton').hidden, 'next fab is hidden');
113+
assert.isNull(codelab.querySelector('.donebutton'), 'done fab is not generated');
114+
115+
var items = codelab.$.toc.items;
116+
assert.equal(codelab.$.toc.selected, 0);
117+
assert.equal(items.length, 2);
118+
assert.match(items[0].textContent.trim(), /1\s*First/);
119+
assert.match(items[1].textContent.trim(), /2\s*Second/);
120+
events.verify(done, 'google-codelab-step-0');
121+
});
105122

106-
// TOC dom-repeat needs another microtask to render
107-
async.nextTick(function() {
108-
assert(codelab.querySelector('.prevbutton').disabled, 'prev fab is not disabled');
109-
assert(!codelab.querySelector('.prevbutton').hidden, 'prev fab is hidden');
110-
assert(!codelab.querySelector('.nextbutton').disabled, 'next fab is disabled');
111-
assert(!codelab.querySelector('.nextbutton').hidden, 'next fab is hidden');
112-
assert.isNull(codelab.querySelector('.donebutton'), 'done fab is not generated');
113-
114-
var items = codelab.$.toc.items;
115-
assert.equal(codelab.$.toc.selected, 0);
116-
assert.equal(items.length, 2);
117-
assert.match(items[0].textContent.trim(), /1\s*First/);
118-
assert.match(items[1].textContent.trim(), /2\s*Second/);
119-
events.verify(done, 'google-codelab-step-0');
120123
});
121124
});
122125

@@ -175,95 +178,107 @@
175178
});
176179
});
177180

178-
}); // text step suite
181+
}); // test step suite
179182

180183
test('prev step', function(done) {
181184
var events = collectEvents(window);
182185
var codelab = fixture('codelab');
183-
codelab.select(1);
184-
MockInteractions.tap(codelab.querySelector('.prevbutton'));
185-
// allow $.toc to render the items
186-
async.nextTick(function() {
187-
assert.equal(codelab.selected, 0, 'selected');
188-
assert.equal(codelab.remaining, '5 min remaining', 'remaining');
189-
assert.match(codelab.$.countdown.textContent.trim(), /5 min/);
190-
assert.equal(codelab.$.toc.selected, 0, '$.toc.selected');
191-
assert(location.hash === '#0' || location.hash === '', 'location.hash');
192-
assert(codelab.querySelector('.prevbutton').disabled, 'prev fab is not disabled');
193-
events.verify(done,
194-
'google-codelab-step-0',
195-
'google-codelab-step-1',
196-
'google-codelab-complete',
197-
'google-codelab-step-0');
186+
187+
codelab.addEventListener('google-codelab-ready', function(e) {
188+
codelab.select(1);
189+
MockInteractions.tap(codelab.querySelector('.prevbutton'));
190+
// allow $.toc to render the items
191+
async.nextTick(function() {
192+
assert.equal(codelab.selected, 0, 'selected');
193+
assert.equal(codelab.remaining, '5 min remaining', 'remaining');
194+
assert.match(codelab.$.countdown.textContent.trim(), /5 min/);
195+
assert.equal(codelab.$.toc.selected, 0, '$.toc.selected');
196+
assert(location.hash === '#0' || location.hash === '', 'location.hash');
197+
assert(codelab.querySelector('.prevbutton').disabled, 'prev fab is not disabled');
198+
events.verify(done,
199+
'google-codelab-step-0',
200+
'google-codelab-step-1',
201+
'google-codelab-complete',
202+
'google-codelab-step-0');
203+
});
198204
});
199205
});
200206

201207
suite('resume dialog', function() {
202208
// resume dialog is shown after about 500ms,
203209
// so each test needs to wait to verify.
204210

205-
test('first visit', function(done) {
211+
test('first visit', function() {
206212
var codelab = fixture('codelab');
207-
setTimeout(function() {
208-
assert(!codelab.$.resumeDialog.opened, 'is opened');
209-
done();
210-
}, 510);
213+
assert(!codelab.$.resumeDialog.opened, 'is opened');
211214
});
212215

213216
test('second visit', function(done) {
214217
ls.setItem(LS_KEY, '{"stepIndex": 1}');
215218
var codelab = fixture('codelab');
216-
var dialog = codelab.$.resumeDialog;
217-
codelab.querySelector('iron-localstorage').reload();
218-
setTimeout(function() {
219-
assert.equal(codelab.selected, 0);
220-
assert.match(dialog.textContent.trim(), /Step 2: Second/);
221-
assert(dialog.opened, 'is closed');
222-
done();
223-
}, 510);
219+
220+
codelab.addEventListener('google-codelab-ready', function(e) {
221+
var dialog = codelab.$.resumeDialog;
222+
codelab.querySelector('iron-localstorage').reload();
223+
setTimeout(function() {
224+
assert.equal(codelab.selected, 0);
225+
assert.match(dialog.textContent.trim(), /Step 2: Second/);
226+
assert(dialog.opened, 'is closed');
227+
done();
228+
}, 510);
229+
});
224230
});
225231

226232
test('second visit, same step', function(done) {
227233
ls.setItem(LS_KEY, '{"stepIndex": 1}');
228234
location.hash = '1';
229235
var codelab = fixture('codelab');
230-
var dialog = codelab.$.resumeDialog;
231-
codelab.querySelector('iron-localstorage').reload();
232-
setTimeout(function() {
233-
assert.equal(codelab.selected, 1, 'selected');
234-
assert(!dialog.opened, 'is opened');
235-
done();
236-
}, 510);
236+
237+
codelab.addEventListener('google-codelab-ready', function(e) {
238+
var dialog = codelab.$.resumeDialog;
239+
codelab.querySelector('iron-localstorage').reload();
240+
// setTimeout(function() {
241+
assert.equal(codelab.selected, 1, 'selected');
242+
assert(!dialog.opened, 'is opened');
243+
done();
244+
// }, 510);
245+
});
237246
});
238247

239248
test('resume', function(done) {
240249
ls.setItem(LS_KEY, '{"stepIndex": 1}');
241250
var events = collectEvents(window);
242251
var codelab = fixture('codelab');
243-
var dialog = codelab.$.resumeDialog;
244-
codelab.querySelector('iron-localstorage').reload();
245-
setTimeout(function() {
246-
MockInteractions.tap(dialog.querySelector('[dialog-confirm]'));
247-
async.nextTick(function() {
248-
verifySecondSelected(codelab);
249-
assert(!dialog.opened, 'is opened');
250-
events.verify(done, 'google-codelab-step-0', 'google-codelab-step-1');
251-
});
252-
}, 510);
252+
253+
codelab.addEventListener('google-codelab-ready', function(e) {
254+
var dialog = codelab.$.resumeDialog;
255+
codelab.querySelector('iron-localstorage').reload();
256+
// setTimeout(function() {
257+
MockInteractions.tap(dialog.querySelector('[dialog-confirm]'));
258+
async.nextTick(function() {
259+
verifySecondSelected(codelab);
260+
assert(!dialog.opened, 'is opened');
261+
events.verify(done, 'google-codelab-step-0', 'google-codelab-step-1');
262+
});
263+
// }, 510);
264+
});
253265
});
254266

255267
test('cancel', function(done) {
256268
ls.setItem(LS_KEY, '{"stepIndex": 1}');
257269
var events = collectEvents(window);
258270
var codelab = fixture('codelab');
259-
var dialog = codelab.$.resumeDialog;
260-
codelab.querySelector('iron-localstorage').reload();
261-
setTimeout(function() {
262-
MockInteractions.tap(dialog.querySelector('[dialog-dismiss]'));
263-
assert.equal(codelab.selected, 0, 'selected');
264-
assert(!dialog.opened, 'is opened');
265-
events.verify(done, 'google-codelab-step-0');
266-
}, 510);
271+
272+
codelab.addEventListener('google-codelab-ready', function(e) {
273+
var dialog = codelab.$.resumeDialog;
274+
codelab.querySelector('iron-localstorage').reload();
275+
// setTimeout(function() {
276+
MockInteractions.tap(dialog.querySelector('[dialog-dismiss]'));
277+
assert.equal(codelab.selected, 0, 'selected');
278+
assert(!dialog.opened, 'is opened');
279+
events.verify(done, 'google-codelab-step-0');
280+
// }, 510);
281+
});
267282
});
268283

269284
}); // resume dialog suite

0 commit comments

Comments
 (0)