1 / 15

Software Testing

Software Testing. Legacy Code. Problem. Does this accurately describe a Rick-roll?. How about this?. Visual Checks Matter!. Types of CSS Testing. There are four different categories of CSS testing: Syntax Did you literally make mistakes in your CSS? Project

rupert
Download Presentation

Software Testing

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Software Testing

  2. Legacy Code

  3. Problem

  4. Does this accurately describe a Rick-roll?

  5. How about this?

  6. Visual Checks Matter!

  7. Types of CSS Testing There are four different categories of CSS testing: • Syntax Did you literally make mistakes in your CSS? • Project Does this CSS meet the standards you set? • Reference Does the rendered page look as you expect it to? Cross-browser as well. • Regression After actions are performed, does the page look as you expect it to?

  8. Tools Here, we'll list all the known tools, browser extensions and services. Command-line enabled • Cactus • CSSCritic • cssert • CSSLint • Fighting Layout Bugs • GhostStory • Hardy • Huxley • MinCSS • Mogotest • Needle • PhantomCSS • Wraith • Grunt-Photobox Manual testing tools • CSSCritic • CSSunit • CSS Test http://csste.st/tools/

  9. Tools Here, we'll list all the known tools, browser extensions and services. Command-line enabled • Cactus • CSSCritic • cssert • CSSLint • Fighting Layout Bugs • GhostStory • Hardy • Huxley • MinCSS • Mogotest • Needle • PhantomCSS • Wraith • Grunt-Photobox Manual testing tools • CSSCritic • CSSunit • CSS Test Syntax Project Reference Regression

  10. Tools Here, we'll list all the known tools, browser extensions and services. Command-line enabled • Cactus • CSSCritic • cssert • CSSLint • Fighting Layout Bugs • GhostStory • Hardy • Huxley • MinCSS • Mogotest • Needle • PhantomCSS • Wraith • Grunt-Photobox Manual testing tools • CSSCritic • CSSunit • CSS Test Syntax Project Reference Regression

  11. Tools Here, we'll list all the known tools, browser extensions and services. Command-line enabled • Cactus • CSSCritic • cssert • CSSLint • Fighting Layout Bugs • GhostStory • Hardy • Huxley • MinCSS • Mogotest • Needle • PhantomCSS • Wraith • Grunt-Photobox Manual testing tools • CSSCritic • CSSunit • CSS Test Syntax Project Reference Regression

  12. Tools Here, we'll list all the known tools, browser extensions and services. Command-line enabled • Cactus • CSSCritic • cssert • CSSLint • Fighting Layout Bugs • GhostStory • Hardy • Huxley • MinCSS • Mogotest • Needle • PhantomCSS • Wraith • Grunt-Photobox Manual testing tools • CSSCritic • CSSunit • CSS Test Syntax Project Reference Regression

  13. Techniques Frozen DOM With Frozen DOM tests, the idea is to take a snapshot of the DOM structure of the page you wish to test and the styles that are currently applied to those DOM elements. Image Diff When you are happy your page looks how it should, take a screenshot. Whenever a new change is made anywhere in the project, take another screenshot and compare the differences. If there are none, everything looks how it should, if there are differences, something broke.

More Related