NicholasBoll

interface AliasFn<Subject> {
  (): Cypress.Chainable<Subject>
  alias: string
}

declare namespace Cypress {
  interface Chainable<Subject> {
    createAlias(): AliasFn<Subject>

    getAliases<T1, T2, T3, T4>(values: [AliasFn<T1>, AliasFn<T2>, AliasFn<T3>, AliasFn<T4>]): Chainable<[T1, T2, T3, T4]>

NicholasBoll

Best Practices for Writing tests

A test isn't given much though until it fails. Anybody should be able to look at a test and understand what and why it failed. Tests should be written for the failure case. Cypress creates an outline in the GUI to help us understand setup and what a test does. Well written tests help us understand what failed. Screenshots and video help us understand how it failed.

Before continuing, read Best Practices from the Cypress documentation first.

Each test must be runnable in complete isolation

A way to decrease test suite run time is to increase the amount of tests being run at the same time. Sharding (or splitting or work) typically happens at the file level, so at minimum a test file should not rely on any state from a previous test file.

NicholasBoll

const addContext = (report, screenshots, videoUrl) => {
  const getTests = t => t.tests
  const getSuites = t => t.suites

  const addSuiteContext = (suite, previousTitles = []) => {
    const titles = suite.title ? previousTitles.concat(suite.title) : previousTitles
    getTests(suite).forEach(test => {
      test.timedOut = false // for some reason this is dropped
      const context = [
        {

NicholasBoll

export const getByName = (name: string) => function getAlarmByName($container: JQuery): JQuery {
  return $container.find(`.alarm-card:contains("${name}")`)
}

NicholasBoll

const compareColor = (color, property) => (targetElement) => {
    const tempElement = document.createElement('div');
    tempElement.style.color = color;
    tempElement.style.display = 'none'; // make sure it doesn't actually render
    document.body.appendChild(tempElement); // append so that `getComputedStyle` actually works
  
    const tempColor = getComputedStyle(tempElement).color;
    const targetColor = getComputedStyle(targetElement[0])[property];
  
    document.body.removeChild(tempElement); // remove it because we're done with it

NicholasBoll

const tooltipMachine = Machine({
  id: "tooltip",
  initial: "closed",
  states: {
    closing: { on: { CLOSE: "closed", OPEN: "opened" } },
    closed: { on: { OPEN: "opened" } },
    opened: { on: { CLOSING: "closing", CLOSE: "closed" } }
  }
});

NicholasBoll

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions

NicholasBoll

Session 2

fetch latest:

git fetch --all

NicholasBoll

Session 3

Today we'll be covering creating compound components using models, behaviors, and utility functions in Canvas Kit that make composability easier. Please refer to the Create Compound Component docs for reference later.

Get the latest changes:

git fetch --all

NicholasBoll

Canvas Kit releases major changes every 6 months. Releases are done by a maintainer. The process is similar to minor releases, except the addition of the support branch. All branches have to be forward merged. Check out all of the following to make sure there are no commits listed:

• https://github.com/Workday/canvas-kit/compare/master...support
• https://github.com/Workday/canvas-kit/compare/prerelease/minor...master
• https://github.com/Workday/canvas-kit/compare/prerelease/major...prerelease/minor

If there are any commits listed, run the forward merge for the branch that isn't merged forward (support, master, or prerelease/minor). It is safe to run this job even if there are no changes since the job will recognize no change and bail.

We'll be using the terms previous major, current major, and next major in the context of versions before the release process is complete. For example, if support is pointing to v4, `ma