Brian Jordan discusses testing challenges for Code.org's interactive computer science curriculum. They developed unit tests using Ruby on Rails, Blockly, and JavaScript to test the dashboard, Blockly apps, and Blockly core. They used BrowserStack for cross-browser testing and jQuery Simulate for drag-and-drop interaction testing. Cucumber tests were written with Selenium to test locally and remotely. Taking a library approach and culture of testing saves time in test writing and development.

1. Testing Code.org's Interactive
Computer Science Curriculum
Brian Jordan, software engineer at Code.org
brian@code.org
@bcjordan
bcjordan.com

2. Code.org

3. non-profit

4. expanding
participation in CS

5. Hour of Code

8. 10 million

9. 43 million

10. now?

11. district partnerships,
professional development

12. 700 teachers trained
10 school districts

13. policy changes

14. K-12 CS Curriculum

15. Testing Challenges

16. what are we up
against?
demo time!

18. testing challenges

19. multiple browsers

20. multiple browsers

21. iOS / Android

22. IE 9

23. localization

24. 33 languages

25. left-to-right

26. right-to-left

27. browser features

28. <svg>, <canvas>

29. Javascript

30. conditional logic to
support all browsers

32. tough but important

33. now let's test it!

34. Unit Tests!

35. dashboard (Ruby on Rails)
blockly (JS, svg, canvas, grunt)
Unit Tests?
blockly-core (JS, svg, Closure Tools)

36. Dashboard
Blockly Apps Blockly Core

37. Rails testing

38. ActiveSupport::TestCase

39. Factory Girl

40. Factory Girl

41. SimpleCov

42. Blockly testing

43. solution tests
grunt-mocha-test
Chai for assertions
node-canvas for drawing

44. solution tests

45. solution tests

46. solution
tests

47. UI tests

48. challenge:
multiple browsers

49. solution:
BrowserStack

50. challenge:
interaction,
drag-and-drop

51. solution:
jQuery Simulate
$(selector).drag…

52. Cucumber —>
Selenium

53. local tests with
chromedriver
@browser = Selenium::WebDriver.for :chrome, :url=>"http://127.0.0.1:9515"

54. remote tests with
BrowserStack
@browser = Selenium::WebDriver.for
:remote,
url => "http://#{browserstack_username}:#{browserstack_authkey}
@hub.browserstack.com/wd/hub"

55. Cucumber is uncomfortable
to start with

56. DSL should be high-level
And I drag block "2" to block "4"

57. Build a library of steps

58. Visit the URL
Given I am on "http://learn.code.org/s/1/level/24"

59. Visit the URL
Given /^I am on "([^"]*)"$/ do |url|
url = replace_hostname(url)
@browser.navigate.to "#{url}"
end

66. Annotations
@no_mobile
@no_ie
@skip
@db_access

67. On BrowserStack

69. Demo: Speed Run

70. Monitoring

71. integration with CI

72. HipChat all the things

76. completion rates

77. per-browser
completion rates

78. Travis CI <> GitHub

79. Takeaways

80. Build up
Library
of Tests

81. Culture of
Testing

82. Saves time in
test writing

83. Saves time in
development

84. Thanks!
Brian Jordan, software engineer at Code.org
brian@code.org
@bcjordan
bcjordan.com
http://code.org/help
http://github.com/code-dot-org