84
Testing Code.org's Interactive Computer Science Curriculum bcjordan.com [email protected] @bcjordan Brian Jordan, software engineer at Code.org

Testing Code.org's Interactive CS Curriculum

Embed Size (px)

DESCRIPTION

Given at http://www.meetup.com/Automated-Testing-San-Francisco/events/207827762/

Citation preview

Page 1: Testing Code.org's Interactive CS Curriculum

Testing Code.org's Interactive Computer Science Curriculum

bcjordan.com

[email protected]@bcjordan

Brian Jordan, software engineer at Code.org

Page 2: Testing Code.org's Interactive CS Curriculum

Code.org

Page 3: Testing Code.org's Interactive CS Curriculum

non-profit

Page 4: Testing Code.org's Interactive CS Curriculum

expanding participation in CS

Page 5: Testing Code.org's Interactive CS Curriculum

Hour of Code

Page 6: Testing Code.org's Interactive CS Curriculum
Page 7: Testing Code.org's Interactive CS Curriculum
Page 8: Testing Code.org's Interactive CS Curriculum

10 million

Page 9: Testing Code.org's Interactive CS Curriculum

43 million

Page 10: Testing Code.org's Interactive CS Curriculum

now?

Page 11: Testing Code.org's Interactive CS Curriculum

district partnerships, professional development

Page 12: Testing Code.org's Interactive CS Curriculum

700 teachers trained 10 school districts

Page 13: Testing Code.org's Interactive CS Curriculum

policy changes

Page 14: Testing Code.org's Interactive CS Curriculum

K-12 CS Curriculum

Page 15: Testing Code.org's Interactive CS Curriculum

Testing Challenges

Page 16: Testing Code.org's Interactive CS Curriculum

what are we up against?

demo time!

Page 17: Testing Code.org's Interactive CS Curriculum
Page 18: Testing Code.org's Interactive CS Curriculum

testing challenges

Page 19: Testing Code.org's Interactive CS Curriculum

multiple browsers

Page 20: Testing Code.org's Interactive CS Curriculum

multiple browsers

Page 21: Testing Code.org's Interactive CS Curriculum

iOS / Android

Page 22: Testing Code.org's Interactive CS Curriculum

IE 9

Page 23: Testing Code.org's Interactive CS Curriculum

localization

Page 24: Testing Code.org's Interactive CS Curriculum

33 languages

Page 25: Testing Code.org's Interactive CS Curriculum

left-to-right

Page 26: Testing Code.org's Interactive CS Curriculum

right-to-left

Page 27: Testing Code.org's Interactive CS Curriculum

browser features

Page 28: Testing Code.org's Interactive CS Curriculum

<svg>, <canvas>

Page 29: Testing Code.org's Interactive CS Curriculum

Javascript

Page 30: Testing Code.org's Interactive CS Curriculum

conditional logic to support all browsers

Page 31: Testing Code.org's Interactive CS Curriculum
Page 32: Testing Code.org's Interactive CS Curriculum

tough but important

Page 33: Testing Code.org's Interactive CS Curriculum

now let's test it!

Page 34: Testing Code.org's Interactive CS Curriculum

Unit Tests!

Page 35: Testing Code.org's Interactive CS Curriculum

Unit Tests?blockly (JS, svg, canvas, grunt)

blockly-core (JS, svg, Closure Tools)

dashboard (Ruby on Rails)

Page 36: Testing Code.org's Interactive CS Curriculum

Dashboard

Blockly CoreBlockly Apps

Page 37: Testing Code.org's Interactive CS Curriculum

Rails testing

Page 38: Testing Code.org's Interactive CS Curriculum

ActiveSupport::TestCase

Page 39: Testing Code.org's Interactive CS Curriculum

Factory Girl

Page 40: Testing Code.org's Interactive CS Curriculum

Factory Girl

Page 41: Testing Code.org's Interactive CS Curriculum

SimpleCov

Page 42: Testing Code.org's Interactive CS Curriculum

Blockly testing

Page 43: Testing Code.org's Interactive CS Curriculum

solution tests

node-canvas for drawing

Chai for assertions

grunt-mocha-test

Page 44: Testing Code.org's Interactive CS Curriculum

solution tests

Page 45: Testing Code.org's Interactive CS Curriculum

solution tests

Page 46: Testing Code.org's Interactive CS Curriculum

solution tests

Page 47: Testing Code.org's Interactive CS Curriculum

UI tests

Page 48: Testing Code.org's Interactive CS Curriculum

challenge:multiple browsers

Page 49: Testing Code.org's Interactive CS Curriculum

solution:

BrowserStack

Page 50: Testing Code.org's Interactive CS Curriculum

challenge:

interaction, drag-and-drop

Page 51: Testing Code.org's Interactive CS Curriculum

solution:jQuery Simulate

$(selector).drag…

Page 52: Testing Code.org's Interactive CS Curriculum

Cucumber —> Selenium

Page 53: Testing Code.org's Interactive CS Curriculum

local tests with chromedriver

@browser = Selenium::WebDriver.for :chrome, :url=>"http://127.0.0.1:9515"

Page 54: Testing Code.org's Interactive CS Curriculum

remote tests with BrowserStack

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

Page 55: Testing Code.org's Interactive CS Curriculum

Cucumber is uncomfortable to start with

Page 56: Testing Code.org's Interactive CS Curriculum

DSL should be high-level

And I drag block "2" to block "4"

Page 57: Testing Code.org's Interactive CS Curriculum

Build a library of steps

Page 58: Testing Code.org's Interactive CS Curriculum

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

Page 59: Testing Code.org's Interactive CS Curriculum

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

Page 60: Testing Code.org's Interactive CS Curriculum
Page 61: Testing Code.org's Interactive CS Curriculum
Page 62: Testing Code.org's Interactive CS Curriculum
Page 63: Testing Code.org's Interactive CS Curriculum
Page 64: Testing Code.org's Interactive CS Curriculum
Page 65: Testing Code.org's Interactive CS Curriculum
Page 66: Testing Code.org's Interactive CS Curriculum

Annotations

@no_mobile

@no_ie@skip

@db_access

Page 67: Testing Code.org's Interactive CS Curriculum

On BrowserStack

Page 68: Testing Code.org's Interactive CS Curriculum
Page 69: Testing Code.org's Interactive CS Curriculum

Demo: Speed Run

Page 70: Testing Code.org's Interactive CS Curriculum

Monitoring

Page 71: Testing Code.org's Interactive CS Curriculum

integration with CI

Page 72: Testing Code.org's Interactive CS Curriculum

HipChat all the things

Page 73: Testing Code.org's Interactive CS Curriculum
Page 74: Testing Code.org's Interactive CS Curriculum
Page 75: Testing Code.org's Interactive CS Curriculum
Page 76: Testing Code.org's Interactive CS Curriculum

completion rates

Page 77: Testing Code.org's Interactive CS Curriculum

per-browser completion rates

Page 78: Testing Code.org's Interactive CS Curriculum

Travis CI <> GitHub

Page 79: Testing Code.org's Interactive CS Curriculum

Takeaways

Page 80: Testing Code.org's Interactive CS Curriculum

Build up Library of Tests

Page 81: Testing Code.org's Interactive CS Curriculum

Culture of Testing

Page 82: Testing Code.org's Interactive CS Curriculum

Saves time in test writing

Page 83: Testing Code.org's Interactive CS Curriculum

Saves time in development

Page 84: Testing Code.org's Interactive CS Curriculum

Thanks!

bcjordan.com

[email protected]@bcjordan

Brian Jordan, software engineer at Code.org

http://code.org/help

http://github.com/code-dot-org