API

The API of CSS Critic.

add()

csscritic.add(testCase)

• Adds a test case to be executed, with testCase being an object of key/value pairs with
  • url link to the test case HTML document,
  • desc a description of the test case,
  • hover a selector matching a single element on the page that should receive a :hover effect,
  • active same but for an :active effect,
  • focus same but for a :focus effect,
  • target same but for a :target effect,
  • width the viewport width, default: 800,
  • height the viewport height, default: 100.
• Optionally the url can be passed in directly if no other options are needed.

component()

csscritic.component(label)

• Groups the test cases added after the call together under the given label.

addReporter()

csscritic.addReporter(reporter)

• Adds a reporter instance for reporting test results.

execute()

csscritic.execute()

• Executes all test cases. Returns a promise that is fulfilled once all tests are done and reporters have finished.

NiceReporter

csscritic.NiceReporter([containerElement])

• A reporter that reports test results in the browser
  • containerElement optional DOM element where the report will be rendered.

---

Reporter API

The following interface can be implemented for custom reporters:

reportSelectedComparison()

reporter.reportSelectedComparison(configuredComparison)

• Called when a test case is starting to be evaluated with configuredComparison being an object of key/value pairs with
  • testCase the test case as passed to csscritic.add(),
  • referenceImage the reference image (if exists),
  • viewport the width and height of the viewport the reference image was rendered with (if exists).

reportDeselectedComparison()

reporter.reportDeselectedComparison(configuredComparison)

• Called when a test case has been configured but deselected from the run with configuredComparison being an object of key/value pairs with
  • testCase the test case as passed to csscritic.add(),
  • referenceImage the reference image (if exists),
  • viewport the width and height of the viewport the reference image was rendered with (if exists).

reportComparison()

reporter.reportComparison(comparison)

• Called when a test case has been evaluated with comparison being an object of key/value pairs with
  • status the result of the test (one out of passed, failed, referenceMissing, error),
  • testCase the test case as passed to csscritic.add(),
  • pageImage the image of the rendered page (if exists),
  • referenceImage the reference image (if exists),
  • renderErrors a list of error messages from rendering (if any),
  • viewport the width and height of the viewport the page is rendered with,
  • resizePageImage(width, height) a method to resize the rendered page, returns a promise (if exists),
  • acceptPage() a method to accept the rendered page as new reference (is exists).

reportTestSuite()

reporter.reportTestSuite(result)

• Called when the test suite has run with result containing key/value pairs with
  • success true if all test passed, false otherwise.

If any of the reporter's methods need to perform asynchronous work they should return a promise and fulfill once done.