@trinitymirrordigital/dragonfly-jest-config/lib/helpers/additional-matchers/shadow_matchers.js

Jest config for dragonfly projects

const isElement = require('lodash/isElement'); // eslint-disable-line

expect.extend({
  toHaveShadowElement(received, argument) {
    // console.log(received, argument)
    const el = received.shadowRoot.querySelector(argument);

    if (isElement(el)) {
      return {
        pass: true,
        message: () => `expected ${received.tagName} to have element ${argument}`,
      };
    }
    return {
      pass: false,
      message: () => `expected ${received.tagName} not to have element ${argument}`,
    };
  },
});

expect.extend({
  toHaveShadowClass(received, query, css) {
    const el = received.shadowRoot.querySelector(query);

    if (isElement(el) && el.classList.contains(css)) {
      return {
        pass: true,
        message: () => `expected ${received.tagName} to have element ${query} with .${css}`,
      };
    }
    return {
      pass: false,
      message: () => `expected ${received.tagName} not to have element ${query} with .${css}`,
    };
  },
});

expect.extend({
  toHaveShadowClass(received, query, css) {
    const el = received.shadowRoot.querySelector(query);

    if (isElement(el) && el.classList.contains(css)) {
      return {
        pass: true,
        message: () => `expected ${received.tagName} to have element ${query} with .${css}`,
      };
    }
    return {
      pass: false,
      message: () => `expected ${received.tagName} not to have element ${query} with .${css}`,
    };
  },
});