[WIP] esbuild

[weronikaolejniczak]

Summary

Resolves #8636

Done:

• Verified what targets are needed: optimize/lib -> lib (for Jest utilities), optimize/es -> es (local and prod), test-env (for Jest env). Potentially can remove lib in the future when Jest utils are moved to a separate package.
• Added a new build pipeline that supports: running without TS declaration generation (for local dev), running in watch mode (for local dev, includes theme packages).

Building locally takes < 1s now. Building for production, 1s + our dtsgenerator.js that takes ~29s. Some TS diagnostics and optimization is needed next.

To do:

• test Kibana with the artifacts (manual + CI)
  • Jest environment
  • FTRs
  • local development (with packing and re-packing)
• test Cloud with the artifacts (CI)
• test the new build script with our CI

Why are we making this change?

Our building process can take ~2.20m each time we build. When testing something in Kibana, that's rebuilding and repacking, moving to Kibana and bootstrapping (~3m per each change we want to test). Additionally, there's no watch mode, so we need to rebuild EUI on demand. When eui-theme-* packages change, we need to rebuild ourselves.

Screenshots #

Impact to users

🔴 It's a big enough change to warrant breaking changes. Things can work differently to before, considering now we're not using Babel, we're using ESBuild to do all our (com|trans)pilation.

QA

Specific checklist

• CI passes
• build passes locally
  • without any flag
  • with --declarations flag
• watch mode works (--watch flag) when:
  • changing packages/eui
  • changing packages/eui-theme-common
  • changing packages/eui-theme-borealis
  • updating icons
  • updating JSON files
• unit tests pass
• Cypress tests pass
• Visual regression tests pass
• Storybook runs as expected
• documentation website runs as expected
  • locally
  • in production (e.g. staging)
• any relevant documentation is updated

General checklist

• Browser QA
  • Checked in both light and dark modes
  • Checked in both MacOS and Windows high contrast modes
    • (emulate forced colors if you do not have access to a Windows machine.)
  • Checked in mobile
  • Checked in Chrome, Safari, Edge, and Firefox
  • Checked for accessibility including keyboard-only and screenreader modes
• Docs site QA
  • Added documentation
  • Props have proper autodocs (using @default if default values are missing) and playground toggles
  • Checked Code Sandbox works for any docs examples
• Code quality checklist
  • Added or updated jest and cypress tests
  • Updated visual regression tests
• Release checklist
  • A changelog entry exists and is marked appropriately
  • If applicable, added the breaking change issue label (and filled out the breaking change checklist)
  • If the changes unblock an issue in a different repo, smoke tested carefully (see Testing EUI features in Kibana ahead of time)
• Designer checklist
  • If applicable, file an issue to update EUI's Figma library with any corresponding UI changes. (This is an internal repo, if you are external to Elastic, ask a maintainer to submit this request)

[elasticmachine]

💚 Build Succeeded

• Buildkite Build
• Commit: 9e85f89
• Documentation website
• Storybook

History

• 💚 Build #1870 succeeded 515edea
• 💔 Build #1869 failed 0ffe3f8

cc @weronikaolejniczak

[elasticmachine]

💔 Build Failed

• Buildkite Build
• Commit: 9e85f89

Failed CI Steps

• 🔨 EUI pull request test

History

• 💔 Build #5167 failed 515edea
• 💔 Build #5166 failed 0ffe3f8

cc @weronikaolejniczak