Your SlideShare is downloading. ×
Dart Power Tools
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Dart Power Tools

822
views

Published on

Increase the speed of Dart software delivery with unit testing, code analysis, headless browser testing, cross-browser and mobile testing, continuous integration, and automated deployments.

Increase the speed of Dart software delivery with unit testing, code analysis, headless browser testing, cross-browser and mobile testing, continuous integration, and automated deployments.

Published in: Technology, Business

1 Comment
0 Likes
Statistics
Notes
  • Be the first to like this

No Downloads
Views
Total Views
822
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
1
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Dart Power Tools Brad Rydzewski & Matt Norris @bradrydzewski @mattnorrisme
  • 2. Dart 1.0!
  • 3. Demo github.com/bradrydzewski/dart-url-shortener
  • 4. What will we learn? Build Dart app Database persistence Test Deploy Language features Tools Continuous Integration
  • 5. Client
  • 6. Including Dart index.html <html> ... <script type="application/dart” src="index.dart"></script> <script src="packages/browser/dart.js"></script> ... </html>
  • 7. Including Dart index.html <html> ... <script type="application/dart” src="index.dart"></script> <script src="packages/browser/dart.js"></script> ... </html>
  • 8. Form index.html index.dart ... void main() { <input type="text" id="long_url" /> querySelector("#btn") <button id="btn">Shorten</button> <a id="short_url” class="hidden"></a> ... .onClick.listen(onClick); } ...
  • 9. Form index.html index.dart ... void main() { <input type="text" id="long_url" /> querySelector("#btn") <button id="btn">Shorten</button> <a id="short_url” class="hidden"></a> ... .onClick.listen(onClick); } ...
  • 10. Form index.html index.dart ... void main() { <input type="text" id="long_url" /> querySelector("#btn") <button id="btn">Shorten</button> <a id="short_url” class="hidden"></a> ... .onClick.listen(onClick); } ...
  • 11. Dart main index.html index.dart ... void main() { <input type="text" id="long_url" /> querySelector("#btn") <button id="btn">Shorten</button> <a id="short_url” class="hidden"></a> ... .onClick.listen(onClick); } ...
  • 12. Attach listener to button index.html index.dart ... void main() { <input type="text" id="long_url" /> querySelector("#btn") <button id="btn">Shorten</button> <a id="short_url” class="hidden"></a> ... .onClick.listen(onClick); } ...
  • 13. index.dart void onClick(MouseEvent event) { HttpRequest request = new HttpRequest(); request.onReadyStateChange.listen((_) { showText(request.responseText); }); ... ... request.send(); }
  • 14. index.dart void onClick(MouseEvent event) { HttpRequest request = new HttpRequest(); request.onReadyStateChange.listen((_) { showText(request.responseText); }); ... ... request.send(); }
  • 15. index.dart void onClick(MouseEvent event) { HttpRequest request = new HttpRequest(); request.onReadyStateChange.listen((_) { showText(request.responseText); }); ... ... request.send(); }
  • 16. index.dart void onClick(MouseEvent event) { HttpRequest request = new HttpRequest(); request.onReadyStateChange.listen((_) { showText(request.responseText); }); ... ... request.send(); }
  • 17. Some sugar void showText(String hash) { var loc = window.location var url = "${loc.protocol}//${loc.host}/${hash}"; var urlShort = querySelector("#url_short") ..attributes["href"] = url ..text = url ..classes.remove("hidden"); }
  • 18. More sugar, please! void showText(String hash) { var loc = window.location var url = "${loc.protocol}//${loc.host}/${hash}"; var urlShort = querySelector("#url_short") ..attributes["href"] = url ..text = url ..classes.remove("hidden"); }
  • 19. Demo github.com/bradrydzewski/dart-url-shortener
  • 20. I must have put a decimal point in the wrong place. I always mess up some mundane detail!
  • 21. Client tests
  • 22. HTML unit test test_index.dart import 'package:unittest/unittest.dart'; import 'package:unittest/html_enhanced_config.dart'; ... main() { useHtmlEnhancedConfiguration(); test("url includes scheme", () { expect(isValidUrl(“www.yahoo.com”), false); expect(isValidUrl(“http://www.yahoo.com”), true); });
  • 23. HTML unit test test_index.dart import 'package:unittest/unittest.dart'; import 'package:unittest/html_enhanced_config.dart'; ... main() { useHtmlEnhancedConfiguration(); test("url includes scheme", () { expect(isValidUrl(“www.yahoo.com”), false); expect(isValidUrl(“http://www.yahoo.com”), true); });
  • 24. HTML unit test test_index.dart import 'package:unittest/unittest.dart'; import 'package:unittest/html_enhanced_config.dart'; ... main() { useHtmlEnhancedConfiguration(); test("url includes scheme", () { expect(isValidUrl(“www.yahoo.com”), false); expect(isValidUrl(“http://www.yahoo.com”), true); });
  • 25. HTML unit test
  • 26. content_shell $ content_shell --dump-render-tree web/test_index.html Content-Type: text/plain PASS All 2 tests passed Collapse All
  • 27. Server
  • 28. Web framework server.dart import 'package:start/start.dart'; start(public: 'web', port: port).then((Server app) { app.post('/’).listen((request) { ... }); });
  • 29. Web framework server.dart import 'package:start/start.dart'; start(public: 'web', port: port).then((Server app) { app.post('/’).listen((request) { ... }); });
  • 30. server.dart void main() { ... app.post("/").listen((request) { String url = request.param('url'); String hash = toHash(url); client.set(hash, url).then((_)=>request.response.json(hash);); }); ...
  • 31. server.dart void main() { ... app.post("/").listen((request) { String url = request.param('url'); String hash = toHash(url); client.set(hash, url).then((_)=>request.response.json(hash);); }); ...
  • 32. server.dart void main() { ... app.post("/").listen((request) { String url = request.param('url'); String hash = toHash(url); client.set(hash, url).then((_)=>request.response.json(hash);); }); ...
  • 33. server.dart void main() { ... app.post("/").listen((request) { String url = request.param('url'); String hash = toHash(url); client.set(hash, url).then((_)=>request.response.json(hash)); }); ...
  • 34. server.dart void main() { ... app.get('/:hash').listen((request) { String hash = request.param('hash'); client.get(hash).then((val) => request.response.redirect(val)); }); ...
  • 35. server.dart void main() { ... app.get('/:hash').listen((request) { String hash = request.param('hash'); client.get(hash).then((val) => request.response.redirect(val)); }); ...
  • 36. server.dart void main() { ... app.get('/:hash').listen((request) { String hash = request.param('hash'); client.get(hash).then((val) => request.response.redirect(val)); }); ...
  • 37. Server tests
  • 38. server_tests.dart import 'package:unittest/unittest.dart'; import 'package:unittest/vm_config.dart'; import 'server.dart' as server; void main() { useVMConfiguration(); String URL = 'http://www.meetup.com/gdg-silicon-valley’; test('HashURL', () { expect(server.toHash(URL), isNotNull); expect(server.toHash(URL), '287b6d95'); ...
  • 39. server_tests.dart import 'package:unittest/unittest.dart'; import 'package:unittest/vm_config.dart'; import 'server.dart' as server; void main() { useVMConfiguration(); String URL = 'http://www.meetup.com/gdg-silicon-valley’; test('HashURL', () { expect(server.toHash(URL), isNotNull); expect(server.toHash(URL), '287b6d95'); ...
  • 40. server_tests.dart import 'package:unittest/unittest.dart'; import 'package:unittest/vm_config.dart'; import 'server.dart' as server; void main() { useVMConfiguration(); String URL = 'http://www.meetup.com/gdg-silicon-valley’; test('HashURL', () { expect(server.toHash(URL), isNotNull); expect(server.toHash(URL), '287b6d95'); ...
  • 41. Run the test $ dart server_tests.dart PASS: HashURL
  • 42. Deployment
  • 43. Deployment $ heroku create $ heroku config:add BUILDPACK_URL=... $ heroku addons:add redistogo $ git push heroku
  • 44. How many OS/browser combos? 200+
  • 45. Cross-browser testing
  • 46. Dart + Selenium browser_tests.dart void main() { ... driver = WebDriver.createDriver( url: “http://localhost:4444/wd/hub”, desiredCapabilities: Capabilities.android); ...
  • 47. Dart + Selenium browser_tests.dart void main() { ... test('integration test', (){ return driver.findElement(new By.id('url_long')) .then((elem)=>elem.sendKeys("https://www.dartlang.org/")) ... .then((attr)=>expect(attr, "https://www.dartlang.org/")) ...
  • 48. Sauce Labs saucelabs.com/tests
  • 49. Continuous Integration
  • 50. drone.io https://drone.io
  • 51. Build Configuration image: dart script: - pub get - pub build - dart bin/server_test.dart deploy: heroku: app: dart-demo
  • 52. Build Configuration image: dart script: - pub get - pub build - dart bin/server_test.dart deploy: heroku: app: dart-demo
  • 53. Build Configuration image: dart script: - pub get - pub build - dart bin/server_test.dart deploy: heroku: app: dart-demo
  • 54. drone.io https://drone.io
  • 55. What have we learned? ✓ ✓ ✓ ✓ ✓ Built Dart app Client & server Database persistence Tested Deployed ✓ Language features ✓ Tools ✓ Continuous Integration
  • 56. What should you do? Try Dart Test things Use tools Deploy!
  • 57. Thank you! Questions?