automating canvas applications using selenium

Automating Canvas Applications Using Selenium

Dave Hunt: @davehunt82Andrew Smith: @andismith

What is Canvas?

The Wilderness Downtownhttp://www.thewildernessdowntown.com/

20 Things I Learnedhttp://www.20thingsilearned.com

Pirates Love Daisieshttp://www.pirateslovedaisies.com/

<CANVAS>

DEMOHuman playing Helicopter

Inside Information

function gameData() {return {

altitude: 20,caveCeiling: [90, 80, 85],caveFloor: [10, 5, 10]

}}

Flight School

• Disabled obstacles

• Compensate momentum

• Field of vision

• Minimise requests

DEMOSelenium playing Helicopter without obstacles

Visual Feedback

• Reintroduced obstacles

• Created a ‘Heads up display’

• Fine-tuned field of vision

DEMOSelenium playing Helicopter with HUD

Crash Testing

def testShouldCrashIntoCeiling(self): base_page = BasePage(self.driver) base_page.start_game() base_page.engage_thrusters() base_page.wait_until_crash() self.assertEquals(base_page.helicopter_altitude, 90)

def testShouldCrashIntoFloor(self): base_page = BasePage(self.driver) base_page.start_game() base_page.wait_until_crash() self.assertEquals(base_page.helicopter_altitude, 14)

How can we do this?

• Work together

• Establish testing requirements

• Write automation hooks

• Consider visual feedback

• Create tests

• Cover your tracks

http://bit.ly/selenicopter

@davehunt82 dhunt@mozilla.com

@andismith andi.smith.uk@gmail.com