Merge branch 'main' of https://github.com/breehall/eui

.eslintplugin.js

@@ -4,5 +4,6 @@ exports.rules = {
   'require-license-header': require('./scripts/eslint-plugin/require_license_header'),
   'forward-ref': require('./scripts/eslint-plugin/forward_ref_display_name'),
   'css-logical-properties': require('./scripts/eslint-plugin/css_logical_properties'),
-  'css_before_spread_props': require('./scripts/eslint-plugin/css_before_spread_props'),
+  css_before_spread_props: require('./scripts/eslint-plugin/css_before_spread_props'),
+  'require-cypress-references': require('./scripts/eslint-plugin/require_cypress_references'),
 };

.eslintrc.js

@@ -11,7 +11,7 @@ const SSPL_ELASTIC_2_0_LICENSE_HEADER = `
 module.exports = {
   parser: '@typescript-eslint/parser',
   parserOptions: {
-    project: ['./tsconfig.json', './tsconfig-cypress.json'],
+    project: ['./tsconfig.json', './cypress/tsconfig.json'],
     ecmaFeatures: {
       jsx: true,
     },
@@ -46,6 +46,7 @@ module.exports = {
     'local/forward-ref': 'error',
     'local/css-logical-properties': 'error',
     'local/css_before_spread_props': 'error',
+    'local/require-cypress-references': 'error',
     'local/require-license-header': [
       'warn',
       {
@@ -130,11 +131,5 @@ module.exports = {
         'react/prefer-stateless-function': 'off',
       },
     },
-    {
-      globals: {
-        cy: true,
-      },
-      files: ['*.spec.js'],
-    },
   ],
 };

CHANGELOG.md

@@ -1,3 +1,15 @@
+## [`77.0.0`](https://github.com/elastic/eui/tree/v77.0.0)
+
+**Bug fixes**
+
+- Fixed named `EuiBadge` colors to reflect custom theme overrides ([#6659](https://github.com/elastic/eui/pull/6659))
+- Fixed user-defined SCSS variables failing to override variables defined in Amsterdam typography overrides. ([#6665](https://github.com/elastic/eui/pull/6665))
+- Fixed bold `EuiCode` tokens to actually be bold ([#6666](https://github.com/elastic/eui/pull/6666))
+
+**Breaking changes**
+
+- Success- and accent-colored `EuiBadge`s and `EuiButton`s have had their fill colors tinted slightly on light mode to be more readable ([#6659](https://github.com/elastic/eui/pull/6659))
+
 ## [`76.4.0`](https://github.com/elastic/eui/tree/v76.4.0)
 
 **CSS-in-JS conversions**

cypress/support/a11y/checkAxe.ts

@@ -6,19 +6,19 @@
  * Side Public License, v 1.
  */
 
-/// <reference types="../"/>
-
 import { defaultContext, defaultAxeConfig } from './defaultAxeConfig';
 import { Result } from 'axe-core';
 
 function _handleViolations(violations: Result[], skipTestFailure?: boolean) {
   // Destructure keys from the violations object to create a readable array
-  const violationData = violations.map(({ id, description, impact, nodes }) => ({
-    id,
-    description,
-    impact,
-    nodes: nodes.length
-  }));
+  const violationData = violations.map(
+    ({ id, description, impact, nodes }) => ({
+      id,
+      description,
+      impact,
+      nodes: nodes.length,
+    })
+  );
 
   // Print reporting only message to the console
   // https://github.com/component-driven/cypress-axe#skipfailures-optional-defaults-to-false
@@ -36,9 +36,9 @@ function _handleViolations(violations: Result[], skipTestFailure?: boolean) {
   // https://github.com/component-driven/cypress-axe#using-the-violationcallback-argument
   cy.task(
     'log',
-    `${violations.length} violation${
-      violations.length === 1 ? '' : 's'
-    } ${violations.length === 1 ? 'was' : 'were'} detected.`
+    `${violations.length} violation${violations.length === 1 ? '' : 's'} ${
+      violations.length === 1 ? 'was' : 'were'
+    } detected.`
   );
 
   // Print the table of violations to the console
@@ -53,19 +53,17 @@ function logViolationsToConsoleOnly(violations: Result[]) {
   _handleViolations(violations, true);
 }
 
-Cypress.Commands.add('checkAxe', ({
-  skipFailures,
-  context,
-  axeConfig,
-  callback
-} = {}) => {
-  cy.injectAxe();
-  cy.checkA11y(
-    context ?? defaultContext,
-    axeConfig ?? defaultAxeConfig,
-    callback ?? skipFailures
-      ? logViolationsToConsoleOnly
-      : logViolationsAndThrow,
-    skipFailures
-  );
-});
+Cypress.Commands.add(
+  'checkAxe',
+  ({ skipFailures, context, axeConfig, callback } = {}) => {
+    cy.injectAxe();
+    cy.checkA11y(
+      context ?? defaultContext,
+      axeConfig ?? defaultAxeConfig,
+      callback ?? skipFailures
+        ? logViolationsToConsoleOnly
+        : logViolationsAndThrow,
+      skipFailures
+    );
+  }
+);

cypress/support/component.tsx

@@ -13,26 +13,22 @@
 // https://on.cypress.io/configuration
 // ***********************************************************
 
-import './commands';
+import '@cypress/code-coverage/support';
+import 'cypress-axe';
+import 'cypress-plugin-tab';
+import 'cypress-real-events';
 
-import React from 'react';
-import { mount } from 'cypress/react';
-import { EuiProvider } from '../../src';
+import './a11y/checkAxe';
+import './keyboard/repeatRealPress';
+import './setup/mount';
+import './setup/realMount';
 
-require(THEME_IMPORT); // defined by DefinePlugin in the cypress webpack config
-
-// Augment the Cypress namespace to include type definitions for
-// your custom command.
-// Alternatively, can be defined in cypress/support/component.d.ts
-// with a <reference path="./component" /> at the top of your spec.
-declare global {
-  namespace Cypress {
-    interface Chainable {
-      mount: typeof mount;
-    }
+// @see https://github.com/quasarframework/quasar/issues/2233#issuecomment-492975745
+// @see also https://github.com/cypress-io/cypress/issues/20341
+Cypress.on('uncaught:exception', (err) => {
+  if (err.message.includes('> ResizeObserver loop limit exceeded')) {
+    return false;
   }
-}
-
-Cypress.Commands.add('mount', (children) => {
-  return mount(<EuiProvider>{children}</EuiProvider>);
 });
+
+require(THEME_IMPORT); // defined by DefinePlugin in the cypress webpack config

cypress/support/index.d.ts

@@ -1,3 +1,4 @@
+import { mount } from 'cypress/react';
 import { ContextObject, Result, RunOptions } from 'axe-core';
 import { realPress } from 'cypress-real-events/commands/realPress';
 
@@ -7,9 +8,6 @@ type RealPressOptions = Parameters<typeof realPress>[1];
 declare global {
   namespace Cypress {
     interface Chainable<Subject> {
-      // We are adding `/// <reference types="../../../cypress/support"/>` to
-      // Cypress specs so VSCode will recognize custom command types.
-
       /**
        * Convenience method to run the axe-core accessibility scanner without having to establish
        * `cy.injectAxe()` in a `beforeEach` block. This method also reports axe violations in the
@@ -29,11 +27,16 @@ declare global {
         callback?: (violations: Result[]) => void;
       }): void;
 
+      /**
+       * Mounts components with a basic `EuiProvider` wrapper
+       */
+      mount: typeof mount;
+
       /**
        * This ensures the correct testing window has focus when using Cypress Real Events.
        * @see https://github.com/dmtrKovalenko/cypress-real-events/issues/196
        */
-      realMount(children: React.ReactNode): void;
+      realMount: typeof mount;
 
       /**
        * Repeat the Real Events `realPress()` method 2 or more times

cypress/support/keyboard/repeatRealPress.ts

@@ -6,8 +6,6 @@
  * Side Public License, v 1.
  */
 
-/// <reference types="../"/>
-
 Cypress.Commands.add('repeatRealPress', (keyToPress, count = 2, options) => {
   for (let i = 0; i < count; i++) {
     cy.realPress(keyToPress, options);

cypress/support/setup/mount.js

@@ -6,8 +6,8 @@
  * Side Public License, v 1.
  */
 
-import { mount as cypressMount } from '@cypress/react';
-import { React, Fragment } from 'react';
+import React from 'react';
+import { mount as cypressMount } from 'cypress/react';
 import { EuiProvider } from '../../../src';
 
 Cypress.Commands.add('mount', (children) => {

cypress/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../tsconfig.json",
+  "include": [
+    "../src/**/*.spec.tsx",
+    "../src/**/*.a11y.tsx",
+  ],
+  "compilerOptions": {
+    "noEmit": true,
+    "types": ["node", "cypress", "cypress-real-events", "cypress-axe"]
+  },
+  "exclude": ["node_modules"],
+}

docs/bundle.min.js.LICENSE.txt

@@ -115,6 +115,8 @@ PERFORMANCE OF THIS SOFTWARE.
 
 /*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */
 
+/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
+
 /**
  * @author Piotr Witek <piotrek.witek@gmail.com> (http://piotrwitek.github.io)
  * @copyright Copyright (c) 2016 Piotr Witek