samples/third_party/todomvc/test/expected/todomvc_markdone_test.html.txt - Issue 23539003: Turn on Polymer TodoMVC tests on Dart buildbots

Side by Side Diff: samples/third_party/todomvc/test/expected/todomvc_markdone_test.html.txt

Issue 23539003: Turn on Polymer TodoMVC tests on Dart buildbots (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart

Patch Set: Created 7 years, 3 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 | Annotate | Revision Log

« samples/tests/samples/todomvc/listorder_test.html ('K') | « samples/third_party/todomvc/test/expected/todomvc_mainpage_test.html.txt ('k') | samples/third_party/todomvc/test/test.dart » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
	(Empty)
1 Content-Type: text/plain

2 <html lang="en"><head><style shadowcssshim="">style { display: none !important; }

3 </style><style shadowcssshim="">template { display: none; }</style>

4 <!--

5 This test runs the TodoMVC app, adds a few todos, marks some as done

6 programatically, and clicks on a checkbox to mark others via the UI.

7 -->

8 <meta charset="utf-8">

9 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

10

11 <link rel="stylesheet" href="../../../web/base.css">

12 <script src="../../packages/polymer/testing/testing.js"></script>

13 <title>Dart • TodoMVC</title>

14 <style>template,

15 thead[template],

16 tbody[template],

17 tfoot[template],

18 th[template],

19 tr[template],

20 td[template],

21 caption[template],

22 colgroup[template],

23 col[template],

24 option[template] {

25 display: none;

26 }</style></head><body><polymer-element name="todo-row" extends="li" attributes=" todo">

27 <template>

28 <style scoped="">

29 .todo-item {

30 position: relative;

31 font-size: 24px;

32 border-bottom: 1px dotted #ccc;

33 }

34

35 .todo-item.editing {

36 border-bottom: none;

37 padding: 0;

38 }

39

40 /*

41 TODO(jmesserly): the ".todo-item label" selector does not work with real

42 ShadowRoot because it crosses the shadow boundary.

43 */

44 .todo-item.completed [is=editable-label] {

45 color: #a9a9a9;

46 text-decoration: line-through;

47 }

48

49 .todo-item .toggle {

50 text-align: center;

51 width: 40px;

52 /* auto, since non-WebKit browsers don't support input styling */

53 height: auto;

54 position: absolute;

55 top: 0;

56 bottom: 0;

57 margin: auto 0;

58 border: none; /* Mobile Safari */

59 -webkit-appearance: none;

60 /-moz-appearance: none;/

61 -ms-appearance: none;

62 -o-appearance: none;

63 appearance: none;

64 }

65

66 .todo-item .toggle:after {

67 content: '✔';

68 line-height: 43px; /* 40 + a couple of pixels visual adjustment */

69 font-size: 20px;

70 color: #d9d9d9;

71 text-shadow: 0 -1px 0 #bfbfbf;

72 }

73

74 .todo-item .toggle:checked:after {

75 color: #85ada7;

76 text-shadow: 0 1px 0 #669991;

77 bottom: 1px;

78 position: relative;

79 }

80 .todo-item .destroy {

81 display: none;

82 position: absolute;

83 top: 0;

84 right: 10px;

85 bottom: 0;

86 width: 40px;

87 height: 40px;

88 margin: auto 0;

89 font-size: 22px;

90 color: #a88a8a;

91 -webkit-transition: all 0.2s;

92 -moz-transition: all 0.2s;

93 -ms-transition: all 0.2s;

94 -o-transition: all 0.2s;

95 transition: all 0.2s;

96 }

97

98 .todo-item .destroy:hover {

99 text-shadow: 0 0 1px #000,

100 0 0 10px rgba(199, 107, 107, 0.8);

101 -webkit-transform: scale(1.3);

102 -moz-transform: scale(1.3);

103 -ms-transform: scale(1.3);

104 -o-transform: scale(1.3);

105 transform: scale(1.3);

106 }

107

108 .todo-item .destroy:after {

109 content: '✖';

110 }

111

112 .todo-item:hover .destroy {

113 display: block;

114 }

115

116 .todo-item.editing .destroy,

117 .todo-item.editing .toggle {

118 display: none;

119 }

120

121 .todo-item.editing:last-child {

122 margin-bottom: -1px;

123 }

124

125 /*

126 Hack to remove background from Mobile Safari.

127 Can't use it globally since it destroys checkboxes in Firefox and Opera

128 */

129 @media screen and (-webkit-min-device-pixel-ratio:0) {

130 .todo-item .toggle {

131 background: none;

132 }

133 #todo-item .toggle {

134 height: 40px;

135 }

136 }

137 </style>

138 <div class="todo-item">

139 <input class="toggle" type="checkbox" checked="{{todo.done}}">

140 <editable-label id="label" value="{{todo.task}}"></editable-label>

141 <button class="destroy" on-click="removeTodo"></button>

142 </div>

143 </template>

144

145 </polymer-element>

146 <polymer-element name="todo-app">

147 <template>

148 <section id="todoapp">

149 <header id="header">

150 <h1 class="title">todos</h1>

151 <form on-submit="addTodo">

152 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o n-change="addTodo">

153 </form>

154 </header>

155 <section id="main">

156 <input id="toggle-all" type="checkbox" checked="{{app.allChecked}}">

157 <label for="toggle-all"></label>

158 <ul id="todo-list">

159 <template repeat="{{app.visibleTodos}}">

160 <li is="todo-row" todo="{{}}"></li>

161 </template>

162 </ul>

163 </section>

164 <template bind="" if="{{app.todos.length > 0}}">

165 <footer id="footer">

166 <span id="todo-count"><strong>{{app.remaining}}</strong></span>

167 <ul is="router-options" id="filters">

168 <li> <a href="#/">All</a> </li>

169 <li> <a href="#/active">Active</a> </li>

170 <li> <a href="#/completed">Completed</a> </li>

171 </ul>

172 <template bind="" if="{{app.hasCompleteTodos}}">

173 <button id="clear-completed" on-click="clear">

174 Clear completed ({{app.doneCount}})

175 </button>

176 </template>

177 </footer>

178 </template>

179 </section>

180 <footer id="info">

181 <p>Double-click to edit a todo.</p>

182 <p>Credits: the <a href="http://www.dartlang.org">Dart</a> team.</p>

183 <p>

184 Learn more about

185 <a href="https://www.dartlang.org/articles/dart-web-components/">Dart + We b Components</a>

186 or

187 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc"> view the source</a>.

188 </p>

189 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p>

190 </footer>

191 </template>

192

193 </polymer-element>

194 <polymer-element name="router-options" extends="ul">

195 <template><content></content></template>

196

197 </polymer-element>

198 <polymer-element name="editable-label" attributes="value">

199 <template>

200 <template bind="" if="{{!editing}}">

201 <label class="edit-label" on-double-click="edit">{{value}}</label>

202 </template>

203 <template bind="" if="{{editing}}">

204 <form on-submit="update">

205 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC ancel">

206 </form>

207 </template>

208 </template>

209

210 </polymer-element>

211

212 <todo-app><shadow-root>

213 <section id="todoapp">

214 <header id="header">

215 <h1 class="title">todos</h1>

216 <form on-submit="addTodo">

217 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o n-change="addTodo">

218 </form>

219 </header>

220 <section id="main">

221 <input id="toggle-all" type="checkbox">

222 <label for="toggle-all"></label>

223 <ul id="todo-list">

224 <template repeat="{{app.visibleTodos}}"></template>

225 <li is="todo-row" todo="{{}}"><shadow-root>

226 <style scoped="">todo-row .todo-item, [is=todo-row] .todo-item {

227 position: relative; font-size: 24px; border-bottom-width: 1px; border-bo ttom-style: dotted; border-bottom-color: rgb(204, 204, 204);

228 }

229

230 todo-row .todo-item.editing, [is=todo-row] .todo-item.editing {

231 border-bottom-style: none; padding: 0px;

232 }

233

234 todo-row .todo-item.completed [is="editable-label"], [is=todo-row] .todo-item.co mpleted [is="editable-label"] {

235 color: rgb(169, 169, 169); text-decoration: line-through;

236 }

237

238 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

239 text-align: center; width: 40px; height: auto; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; border: none; -webkit-appearance: none;

240 }

241

242 todo-row .todo-item .toggle::after, [is=todo-row] .todo-item .toggle::after {

243 content: '✔'; line-height: 43px; font-size: 20px; color: rgb(217, 217, 2 17); text-shadow: rgb(191, 191, 191) 0px -1px 0px;

244 }

245

246 todo-row .todo-item .toggle:checked::after, [is=todo-row] .todo-item .toggle:che cked::after {

247 color: rgb(133, 173, 167); text-shadow: rgb(102, 153, 145) 0px 1px 0px; bottom: 1px; position: relative;

248 }

249

250 todo-row .todo-item .destroy, [is=todo-row] .todo-item .destroy {

251 display: none; position: absolute; top: 0px; right: 10px; bottom: 0px; w idth: 40px; height: 40px; margin: auto 0px; font-size: 22px; color: rgb(168, 138 , 138); transition: all 0.2s; -webkit-transition: all 0.2s;

252 }

253

254 todo-row .todo-item .destroy:hover, [is=todo-row] .todo-item .destroy:hover {

255 text-shadow: rgb(0, 0, 0) 0px 0px 1px, rgba(199, 107, 107, 0.8) 0px 0px 10px; -webkit-transform: scale(1.3);

256 }

257

258 todo-row .todo-item .destroy::after, [is=todo-row] .todo-item .destroy::after {

259 content: '✖';

260 }

261

262 todo-row .todo-item:hover .destroy, [is=todo-row] .todo-item:hover .destroy {

263 display: block;

264 }

265

266 todo-row .todo-item.editing .destroy, [is=todo-row] .todo-item.editing .destroy, todo-row .todo-item.editing .toggle, [is=todo-row] .todo-item.editing .toggle {

267 display: none;

268 }

269

270 todo-row .todo-item.editing:last-child, [is=todo-row] .todo-item.editing:last-ch ild {

271 margin-bottom: -1px;

272 }

273

274 @media screen and (-webkit-min-device-pixel-ratio: 0) {

275 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

276 background-image: none; background-position: initial initial; background -repeat: initial initial;

277 }

278

279 todo-row #todo-item .toggle, [is=todo-row] #todo-item .toggle {

280 height: 40px;

281 }

282

283

284 }

285

286 </style>

287 <div class="todo-item">

288 <input class="toggle" type="checkbox">

289 <editable-label id="label" value="{{todo.task}}"><shadow-root>

290 <template bind="" if="{{!editing}}"></template>

291 <label class="edit-label" on-double-click="edit">one (unchecked)</label>

292

293 <template bind="" if="{{editing}}"></template>

294 </shadow-root></editable-label>

295 <button class="destroy" on-click="removeTodo"></button>

296 </div>

297 </shadow-root></li>

298

299 <li is="todo-row" todo="{{}}"><shadow-root>

300 <style scoped="">todo-row .todo-item, [is=todo-row] .todo-item {

301 position: relative; font-size: 24px; border-bottom-width: 1px; border-bo ttom-style: dotted; border-bottom-color: rgb(204, 204, 204);

302 }

303

304 todo-row .todo-item.editing, [is=todo-row] .todo-item.editing {

305 border-bottom-style: none; padding: 0px;

306 }

307

308 todo-row .todo-item.completed [is="editable-label"], [is=todo-row] .todo-item.co mpleted [is="editable-label"] {

309 color: rgb(169, 169, 169); text-decoration: line-through;

310 }

311

312 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

313 text-align: center; width: 40px; height: auto; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; border: none; -webkit-appearance: none;

314 }

315

316 todo-row .todo-item .toggle::after, [is=todo-row] .todo-item .toggle::after {

317 content: '✔'; line-height: 43px; font-size: 20px; color: rgb(217, 217, 2 17); text-shadow: rgb(191, 191, 191) 0px -1px 0px;

318 }

319

320 todo-row .todo-item .toggle:checked::after, [is=todo-row] .todo-item .toggle:che cked::after {

321 color: rgb(133, 173, 167); text-shadow: rgb(102, 153, 145) 0px 1px 0px; bottom: 1px; position: relative;

322 }

323

324 todo-row .todo-item .destroy, [is=todo-row] .todo-item .destroy {

325 display: none; position: absolute; top: 0px; right: 10px; bottom: 0px; w idth: 40px; height: 40px; margin: auto 0px; font-size: 22px; color: rgb(168, 138 , 138); transition: all 0.2s; -webkit-transition: all 0.2s;

326 }

327

328 todo-row .todo-item .destroy:hover, [is=todo-row] .todo-item .destroy:hover {

329 text-shadow: rgb(0, 0, 0) 0px 0px 1px, rgba(199, 107, 107, 0.8) 0px 0px 10px; -webkit-transform: scale(1.3);

330 }

331

332 todo-row .todo-item .destroy::after, [is=todo-row] .todo-item .destroy::after {

333 content: '✖';

334 }

335

336 todo-row .todo-item:hover .destroy, [is=todo-row] .todo-item:hover .destroy {

337 display: block;

338 }

339

340 todo-row .todo-item.editing .destroy, [is=todo-row] .todo-item.editing .destroy, todo-row .todo-item.editing .toggle, [is=todo-row] .todo-item.editing .toggle {

341 display: none;

342 }

343

344 todo-row .todo-item.editing:last-child, [is=todo-row] .todo-item.editing:last-ch ild {

345 margin-bottom: -1px;

346 }

347

348 @media screen and (-webkit-min-device-pixel-ratio: 0) {

349 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

350 background-image: none; background-position: initial initial; background -repeat: initial initial;

351 }

352

353 todo-row #todo-item .toggle, [is=todo-row] #todo-item .toggle {

354 height: 40px;

355 }

356

357

358 }

359

360 </style>

361 <div class="todo-item">

362 <input class="toggle" type="checkbox">

363 <editable-label id="label" value="{{todo.task}}"><shadow-root>

364 <template bind="" if="{{!editing}}"></template>

365 <label class="edit-label" on-double-click="edit">two (unchecked)</label>

366

367 <template bind="" if="{{editing}}"></template>

368 </shadow-root></editable-label>

369 <button class="destroy" on-click="removeTodo"></button>

370 </div>

371 </shadow-root></li>

372

373 <li is="todo-row" todo="{{}}"><shadow-root>

374 <style scoped="">todo-row .todo-item, [is=todo-row] .todo-item {

375 position: relative; font-size: 24px; border-bottom-width: 1px; border-bo ttom-style: dotted; border-bottom-color: rgb(204, 204, 204);

376 }

377

378 todo-row .todo-item.editing, [is=todo-row] .todo-item.editing {

379 border-bottom-style: none; padding: 0px;

380 }

381

382 todo-row .todo-item.completed [is="editable-label"], [is=todo-row] .todo-item.co mpleted [is="editable-label"] {

383 color: rgb(169, 169, 169); text-decoration: line-through;

384 }

385

386 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

387 text-align: center; width: 40px; height: auto; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; border: none; -webkit-appearance: none;

388 }

389

390 todo-row .todo-item .toggle::after, [is=todo-row] .todo-item .toggle::after {

391 content: '✔'; line-height: 43px; font-size: 20px; color: rgb(217, 217, 2 17); text-shadow: rgb(191, 191, 191) 0px -1px 0px;

392 }

393

394 todo-row .todo-item .toggle:checked::after, [is=todo-row] .todo-item .toggle:che cked::after {

395 color: rgb(133, 173, 167); text-shadow: rgb(102, 153, 145) 0px 1px 0px; bottom: 1px; position: relative;

396 }

397

398 todo-row .todo-item .destroy, [is=todo-row] .todo-item .destroy {

399 display: none; position: absolute; top: 0px; right: 10px; bottom: 0px; w idth: 40px; height: 40px; margin: auto 0px; font-size: 22px; color: rgb(168, 138 , 138); transition: all 0.2s; -webkit-transition: all 0.2s;

400 }

401

402 todo-row .todo-item .destroy:hover, [is=todo-row] .todo-item .destroy:hover {

403 text-shadow: rgb(0, 0, 0) 0px 0px 1px, rgba(199, 107, 107, 0.8) 0px 0px 10px; -webkit-transform: scale(1.3);

404 }

405

406 todo-row .todo-item .destroy::after, [is=todo-row] .todo-item .destroy::after {

407 content: '✖';

408 }

409

410 todo-row .todo-item:hover .destroy, [is=todo-row] .todo-item:hover .destroy {

411 display: block;

412 }

413

414 todo-row .todo-item.editing .destroy, [is=todo-row] .todo-item.editing .destroy, todo-row .todo-item.editing .toggle, [is=todo-row] .todo-item.editing .toggle {

415 display: none;

416 }

417

418 todo-row .todo-item.editing:last-child, [is=todo-row] .todo-item.editing:last-ch ild {

419 margin-bottom: -1px;

420 }

421

422 @media screen and (-webkit-min-device-pixel-ratio: 0) {

423 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

424 background-image: none; background-position: initial initial; background -repeat: initial initial;

425 }

426

427 todo-row #todo-item .toggle, [is=todo-row] #todo-item .toggle {

428 height: 40px;

429 }

430

431

432 }

433

434 </style>

435 <div class="todo-item completed">

436 <input class="toggle" type="checkbox">

437 <editable-label id="label" value="{{todo.task}}"><shadow-root>

438 <template bind="" if="{{!editing}}"></template>

439 <label class="edit-label" on-double-click="edit">three (checked)</label>

440

441 <template bind="" if="{{editing}}"></template>

442 </shadow-root></editable-label>

443 <button class="destroy" on-click="removeTodo"></button>

444 </div>

445 </shadow-root></li>

446

447 <li is="todo-row" todo="{{}}"><shadow-root>

448 <style scoped="">todo-row .todo-item, [is=todo-row] .todo-item {

449 position: relative; font-size: 24px; border-bottom-width: 1px; border-bo ttom-style: dotted; border-bottom-color: rgb(204, 204, 204);

450 }

451

452 todo-row .todo-item.editing, [is=todo-row] .todo-item.editing {

453 border-bottom-style: none; padding: 0px;

454 }

455

456 todo-row .todo-item.completed [is="editable-label"], [is=todo-row] .todo-item.co mpleted [is="editable-label"] {

457 color: rgb(169, 169, 169); text-decoration: line-through;

458 }

459

460 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

461 text-align: center; width: 40px; height: auto; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; border: none; -webkit-appearance: none;

462 }

463

464 todo-row .todo-item .toggle::after, [is=todo-row] .todo-item .toggle::after {

465 content: '✔'; line-height: 43px; font-size: 20px; color: rgb(217, 217, 2 17); text-shadow: rgb(191, 191, 191) 0px -1px 0px;

466 }

467

468 todo-row .todo-item .toggle:checked::after, [is=todo-row] .todo-item .toggle:che cked::after {

469 color: rgb(133, 173, 167); text-shadow: rgb(102, 153, 145) 0px 1px 0px; bottom: 1px; position: relative;

470 }

471

472 todo-row .todo-item .destroy, [is=todo-row] .todo-item .destroy {

473 display: none; position: absolute; top: 0px; right: 10px; bottom: 0px; w idth: 40px; height: 40px; margin: auto 0px; font-size: 22px; color: rgb(168, 138 , 138); transition: all 0.2s; -webkit-transition: all 0.2s;

474 }

475

476 todo-row .todo-item .destroy:hover, [is=todo-row] .todo-item .destroy:hover {

477 text-shadow: rgb(0, 0, 0) 0px 0px 1px, rgba(199, 107, 107, 0.8) 0px 0px 10px; -webkit-transform: scale(1.3);

478 }

479

480 todo-row .todo-item .destroy::after, [is=todo-row] .todo-item .destroy::after {

481 content: '✖';

482 }

483

484 todo-row .todo-item:hover .destroy, [is=todo-row] .todo-item:hover .destroy {

485 display: block;

486 }

487

488 todo-row .todo-item.editing .destroy, [is=todo-row] .todo-item.editing .destroy, todo-row .todo-item.editing .toggle, [is=todo-row] .todo-item.editing .toggle {

489 display: none;

490 }

491

492 todo-row .todo-item.editing:last-child, [is=todo-row] .todo-item.editing:last-ch ild {

493 margin-bottom: -1px;

494 }

495

496 @media screen and (-webkit-min-device-pixel-ratio: 0) {

497 todo-row .todo-item .toggle, [is=todo-row] .todo-item .toggle {

498 background-image: none; background-position: initial initial; background -repeat: initial initial;

499 }

500

501 todo-row #todo-item .toggle, [is=todo-row] #todo-item .toggle {

502 height: 40px;

503 }

504

505

506 }

507

508 </style>

509 <div class="todo-item completed">

510 <input class="toggle" type="checkbox">

511 <editable-label id="label" value="{{todo.task}}"><shadow-root>

512 <template bind="" if="{{!editing}}"></template>

513 <label class="edit-label" on-double-click="edit">four (checked)</label>

514

515 <template bind="" if="{{editing}}"></template>

516 </shadow-root></editable-label>

517 <button class="destroy" on-click="removeTodo"></button>

518 </div>

519 </shadow-root></li>

520

521 </ul>

522 </section>

523 <template bind="" if="{{app.todos.length > 0}}"></template>

524 <footer id="footer">

525 <span id="todo-count"><strong>2</strong></span>

526 <ul is="router-options" id="filters"><shadow-root><content></content></s hadow-root>

527 <li> <a href="#/" class="selected">All</a> </li>

528 <li> <a href="#/active" class="">Active</a> </li>

529 <li> <a href="#/completed" class="">Completed</a> </li>

530 </ul>

531 <template bind="" if="{{app.hasCompleteTodos}}"></template>

532 <button id="clear-completed" on-click="clear">

533 Clear completed (2)

534 </button>

535

536 </footer>

537

538 </section>

539 <footer id="info">

540 <p>Double-click to edit a todo.</p>

541 <p>Credits: the <a href="http://www.dartlang.org">Dart</a> team.</p>

542 <p>

543 Learn more about

544 <a href="https://www.dartlang.org/articles/dart-web-components/">Dart + We b Components</a>

545 or

546 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc"> view the source</a>.

547 </p>

548 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p>

549 </footer>

550 </shadow-root></todo-app>

551

552

553

554 <script type="text/javascript" src="packages/shadow_dom/shadow_dom.debug.js"></s cript>

555 <script type="text/javascript" src="packages/browser/interop.js"></script>

556 <script type="application/dart" src="todomvc_markdone_test.html_bootstrap.dart"> </script></body></html>

OLD	NEW