Download as PDF, PPTX
Uploaded byRuben Teijeiro
Front-end Automated Testing
The document discusses front-end automated testing in web development, emphasizing tools like QUnit and Selenium for testing configurations and assertions. It highlights the importance of continuous integration in creating efficient, repeatable tests that enhance code reliability. The content also features humorous references to web design and the need for quick, user-friendly solutions.
More Related Content
![UiPath Automation Suite Installation (Hands-On) [2/3]](https://cdn.slidesharecdn.com/ss_thumbnails/automationsuitecommunitysession2-251015095633-a6d862f1-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Front-end Automated Testing
- 1. Front-end Automated TestingFront-endAutomated Testing #drupal-fat#drupal-fat
- 2. I don't know whatI like more: Drupal or Beer @rteijeiro Ruben TeijeiroRuben Teijeiro @rteijeiro
- 3.
- 5. I'm configuring the server.It will be ready in a few weeks. Dev OpsDev Ops
- 6.
- 7. This design isreally fancy. I made it shiny and edgy. Now it pops!! DesignersDesigners
- 8.
- 9. Content ManagersContent Managers In-placeContent Authoring
- 10.
- 11. We want something like Facebook,but we need it yesterday. And banners with kittens. Everyone loves kittens. We should use Comic Sans, it's such a fancy and funny font. CustomersCustomers
- 12.
- 13.
- 15. CSSCSS I said "float:left"!!!
- 17.
- 18. Final ResultFinal Result Andnow I will show you how it looks in Internet Explorer 7
- 19.
- 20.
- 21. Front-end Automated TestingFront-endAutomated Testing Because people likes code that works
- 22.
- 23. ● Automated ● Repeteable ●Easy to understand ● Incremental ● Easy to run ● Fast Unit TestUnit Test
- 24. ● QUnit ● Selenium ●Jasmine ● PhantomJS ● YUI Test Testing ToolsTesting Tools
- 25.
- 26. getInfo: function() { return{ name: 'Drupal Test', description: 'My first Drupal test', group: 'Tests' }; } Test ConfigurationTest Configuration
- 27. Test ConfigurationTest Configuration setup:function() { this.bbq = "Put some bacon here..."; }
- 28. Test ConfigurationTest Configuration teardown:function() { this.bbq = "More bacon for the bbq."; }
- 29. ● ok ● equal ●notEqual ● deepEqual ● notDeepEqual ● strictEqual ● notStrictEqual ● throws AssertionsAssertions
- 30. this.bbq = true; QUnit.ok(this.bbq, Drupal.t('Wehave barbecue.')); QUnit.okQUnit.ok
- 31. this.bbq = 'Bacon'; QUnit.equal(this.bbq,'Bacon', Drupal.t('This is a Bacon Barbecue')); QUnit.equalQUnit.equal
- 32. this.bbq = 'Bacon'; QUnit.notEqual(this.bbq,'Chicken', Drupal.t('This is not a Chicken Barbecue')); QUnit.notEqualQUnit.notEqual
- 33. this.bbq = {meat: 'Bacon' }; QUnit.deepEqual(this.bbq, {meat: 'Bacon' }, Drupal.t('This is a Bacon Barbecue')); QUnit.deepEqualQUnit.deepEqual
- 34. this.bbq = {meat: 'Chicken' }; QUnit.notDeepEqual(this.bbq, {meat: 'Bacon' }, Drupal.t('This is not a Bacon Barbecue')); QUnit.notDeepEqualQUnit.notDeepEqual
- 35. this.bbq = 'Bacon'; QUnit.strictEqual(this.bbq,'Bacon', Drupal.t('This is a Bacon Barbecue')); QUnit.strictEqualQUnit.strictEqual
- 36. this.bbq = 5; QUnit.notStrictEqual(this.bbq,'5', Drupal.t('This is not a Barbecue for 5')); QUnit.notStrictEqualQUnit.notStrictEqual
- 37. throws( function() { throw "Nobarbecue." }, "There is no barbecue." ); QUnit.throwsQUnit.throws
- 38. Synchronous CallbacksSynchronous Callbacks QUnit.expect(3); this.bbq= 'Bacon'; QUnit.ok(this.bbq = 'Bacon', Drupal.t('Bacon barbecue.')); QUnit.equal(this.bbq, 'Bacon', Drupal.t('Bacon barbecue.')); QUnit.deepEqual(this.bbq, 'Bacon', Drupal.t('Bacon barbecue.'));
- 39. Asynchronous CallbacksAsynchronous Callbacks vardelay = 1000; this.bbq = 'Bacon'; QUnit.stop(); setTimeout( function() { QUnit.ok(this.bbq == 'Bacon', Drupal.t('1 second barbecue.'); QUnit.start(); }, delay);
- 40. Testing User ActionsTestingUser Actions this.bbq.val('Bacon').trigger('keyup'); QUnit.ok(this.bbq.val == 'Bacon', Drupal.t('Barbecue with keyup.'));
- 41.
- 42.
- 43.
- 44.
- 45.