* Add more drills tests, unify tests structure, add issues refs

* Add tests for fk-details drill apply

* Tests fixes after merge with master

* Code review fixes

* Comment failing tests after merging with master

* Restore sort drill tests

* wip

* Add comma and fix spelling error

* Added some padding and things

* switch control styles

* text styles

* add storybook examples

* Add guidance text

* Add top padding for small switches

* change default size from `sm` to `md`

* fix missing default `size` prop

* fix paddings

* remove label padding if empty

* use `getStylesRef`

---------

Co-authored-by: Oisin Coveney <oisin@metabase.com>
Co-authored-by: Maz Ameli <maz@metabase.com>

### Background

CLJS output is not watched by webpack. (Watching it causes full page reloads I can't find a way to stop.)
CLJS changes are hot reloaded by shadow-cljs separate from webpack.

Changing CLJS code works great: shadow-cljs hot reloads it and it works nicely.

Changing JS code also works: webpack recompiles (including the latest CLJS output), the browser refreshes, and all is
well.

### The Problem

If you refresh the browser after you've changed only CLJS code, webpack does not know it must recompile the bundles.
Therefore it serves up the old bundles, which have now-stale CLJS output in them.

### The "Solution"

The first time shadow-cljs hot reloads after a CLJS change, a hook in `metabase.util.devtools` registers a
`beforeunload` handler. This handler sends a request to `http://localhost:8080/webpack-dev-server/invalidate`, forcing
webpack to recompile the bundles.

That isn't such a terrible hack by itself. The ugly part is that there's a race
condition between webpack invalidating the bundles and the browser trying to
load the bundles after the refresh, and sometimes the browser wins (loading the
stale CLJS). I added a spin-lock, repeatedly checking `performance.now()` until
500ms have passed, then the handler returns. This small delay gives webpack
time to mark the bundles invalid and allow the refresh.

I haven't experimented with how long that delay needs to be for this to be
reliable. Since this handler is only attached after CLJS code has been hot
reloaded, it will never run for most FE devs.

### Alternative: Smarter webpack

The best solution would be to make webpack
- recompile the bundles when the CLJS output changes; but
- not try to HMR them (which triggers a browser refresh and ruins CLJS hot reloading)
but I have not found any way to configure this out of the box. I think it would require patching `ReactRefreshPlugin`,
a nontrivial job. It might also be possible for shadow-cljs to poke webpack after it finishes building, but there's the
same problem that webpack will want to HMR.

Webpack doesn't support any "lazy" invalidation; as far as I know there's no
way to say "this bundle is now invalid but don't recompile it until someone
tries to GET it" or anything like that.

### Alternative: Block refresh then continue

The `beforeunload` handler could instead work like this:
- `preventDefault()` on the event, stopping the refresh.
- `fetch()` the `invalidate` route as above.
- asynchronously, when that `fetch()` is done and we know webpack has invalidated the bundles, trigger a refresh.

I haven't tried this, since it seems more complicated than the spin-lock. We just need to give the `invalidate` request
a head start.

* Minor updates to the developer's guide

* extra context

---------

Co-authored-by: dan sutton <dan@dpsutton.com>

* Make it easy to add SQLite database

* Replace H2 with SQLite in E2E tests

* Remove long unused E2E reproduction

It's been sufficiently covered with backend tests.

* Remove H2 database helper from E2E tests

* Show a warning modal when clicking "Cancel" in dashboard

* Update dashboard test

* Update question settings test

* Add missing "Edit dashboard" click

* Add tests for leaving dashboard editing via Cancel button

* Add model-editing logic to isLocationAllowed in QueryBuilder

* Fix IS_LOCATION_ALLOWED implementation

* Fix typos

* Remove redundant checks and invert logic for better readability

* Add editing queries tests

* Improve test to include reverted form interaction

* Fix existing test case

* Add editing metadata test

* Add editing metadata test (unedited)

* Organize tests

* Add a test for not showing custom warning modal when saving edited query

* Extract slug to TEST_MODEL_CARD_SLUG

* Add a test for not showing custom warning modal when saving edited metadata

* Remove redundant routing

* Add a workaround for test setup

* Add a test for tabs navigation

* Fix failing test

* Extract isNavigationAllowed out of isLocationAllowed

* Extract createMockLocation

* Add isNavigationAllowed test setup and test for new questions

* Add a test case for beforeunload event

* Format code

* Add more tests and organize them

* Add notebook question tests

* Format code

* Rename component to match the filename

* Fix typo

* Replace useBeforeUnload with LeaveConfirmationModal in SegmentForm

* Replace useBeforeUnload with LeaveConfirmationModal in MetricForm

* Update setup of MetricForm tests to allow testing navigation

* Update setup of SegmentForm tests to allow testing navigation

* Use proper history in MetricForm

* Refactor SegmentForm test setup to be consistent with the one of MetricForm

* Make MetricForm and SegmentForm tests consistent

* Add tests for not showing custom warning

* Add tests for showing custom warning when leaving with unsaved changes

* Extract FORM_URL

* Remove redundant asyncs and awaits

* Rename MetricForm.unit.spec.tsx & SegmentForm.unit.spec.tsx to MetricApp.unit.spec.tsx & SegmentApp.unit.spec.tsx and move them near the components they're testing

* Improve a11y

* Add missing endpoint mocks

* Improve selectors thanks to proper a11y

* Add tests for not showing warning modal when saving changes

* Convert CreateMetricForm to a functional component

* Convert CreateSegmentForm to a functional component

* Convert UpdateMetricFormInner to a functional component

* Convert UpdateSegmentFormInner to a functional component

* Disable LeaveConfirmationModal on scheduled navigation

* Setup metrics & segments POST endpoints

* Properly mock metric and segment creation

* Lift LeaveConfirmationModal from SegmentForm to SegmentApp

* Lift LeaveConfirmationModal from MetricForm to MetricApp

* Sort props

* Get rid of useCallbackEffect usage in MetricApp

* Get rid of useCallbackEffect usage in SegmentApp

* Implement #33646

* More dox

* Seconds, not milliseconds

* Respect env var values

I broke tests on master with the following change:
0d77aba#diff-205d5528aa8f03902903027631d50ef76459835737fb06b16e55fdd1d7430c8eL331

Relevant failure: https://www.deploysentinel.com/ci/runs/651d290ef6799f2563b8b986

This PR brings it back.

It was deprecated and left in a codebase for backwards compatibility.
But it seems we've migrated all references to the new method `delete-file-if-exists`.

The last time this was touched was three years ago.
Should be safe to remove.

* Fix the flakes for metrics as well

added an example of rounding with a decimal place

`yarn dev` had been adjusted to use `build-hot:js-wait` (which waits for the first CLJS compilation to be done), but `yarn dev-ee` had not been changed, so its JS compilation ran too early, failed, and never re-ran.

We actually had this broken behavior (JS build runs too early, CLJS build completes, JS build fails, JS build notices new inputs and re-runs) for a long time. But since it fixed itself when the JS build re-ran, it didn't cause any issues. Now that the JS build no longer watches the CLJS output for changes, the CLJS output needs to be there for the first JS build.