Move libs/api-mocks to top-level mock-api dir (#1976)

* move /app/test to /test

* move libs/api-mocks to mock-api

README.md

@@ -75,7 +75,7 @@ and navigate to http://localhost:4000 in the browser. The running app will autom
 #### Specifying non-default user
 
 Pick a user from the list of users in
-[`libs/api-mocks/user.ts`](/libs/api-mocks/user.ts). The one without fleet
+[`mock-api/user.ts`](/mock-api/user.ts). The one without fleet
 viewer permissions is `Hans Jonas`. Open the browser console and run:
 
 ```js
@@ -153,7 +153,7 @@ This will start a preview environment for UI components at `http://localhost:610
 
 ### E2E tests with [Playwright](https://playwright.dev/)
 
-Playwright tests live in [`app/test/e2e`](app/test/e2e/). `npm run e2e` runs the tests in Chrome, Firefox, and Safari, but this is rarely necessary in local dev. `npm run e2ec` is a shortcut for `playwright test --project=chrome`, which runs the tests in Chrome only (the fastest one, useful for local dev). Playwright has an excellent [UI mode](https://playwright.dev/docs/test-ui-mode) for running and debugging tests that you can get to by running `npm run e2e -- --ui`.
+Playwright tests live in [`test/e2e`](test/e2e/). `npm run e2e` runs the tests in Chrome, Firefox, and Safari, but this is rarely necessary in local dev. `npm run e2ec` is a shortcut for `playwright test --project=chrome`, which runs the tests in Chrome only (the fastest one, useful for local dev). Playwright has an excellent [UI mode](https://playwright.dev/docs/test-ui-mode) for running and debugging tests that you can get to by running `npm run e2e -- --ui`.
 
 To debug end-to-end failures on CI, check out the branch with the failure and run `./tools/debug-ci-e2e-fail.sh`. It'll download the latest failures from CI and allow you to open a [playwright trace](https://playwright.dev/docs/trace-viewer-intro#viewing-the-trace) of the failure.
 

app/components/form/fields/DateTimeRangePicker.spec.tsx

@@ -10,10 +10,13 @@ import { fireEvent, render, screen } from '@testing-library/react'
 import ResizeObserverPolyfill from 'resize-observer-polyfill'
 import { beforeAll, describe, expect, it, vi } from 'vitest'
 
-import { clickByRole } from 'app/test/unit'
-
 import { DateTimeRangePicker, type RangeKey } from './DateTimeRangePicker'
 
+export function clickByRole(role: string, name: string) {
+  const element = screen.getByRole(role, { name })
+  fireEvent.click(element)
+}
+
 const now = getNow(getLocalTimeZone())
 
 function renderLastDay() {

docs/mock-api-differences.md

@@ -14,7 +14,7 @@ on the callback ensures we are returning the right kind of thing from the
 endpoint.
 
 The manual implementation has an in-memory "database" (see
-[`libs/api-mocks/msw/db.ts`](/libs/api-mocks/msw/db.ts)) which is just a JS
+[`mock-api/msw/db.ts`](/mock-api/msw/db.ts)) which is just a JS
 object with a property for each "table", which is just an array of models. We
 use the generated types to make sure our mock seed data has the correct shape.
 
@@ -35,10 +35,9 @@ the mock server runs in the browser, it gets reset on pageload.
 
 ### Authentication and authorization
 
-This is a big one. At time of writing, we only do one kind of authz check in the
-mock API, and that's whether the user has fleet viewer permission. See
-`requireFleetViewer` in
-[`libs/api-mocks/msw/util.ts`](/libs/api-mocks/msw/util.ts). All
+This is a big one. At time of writing, we only do one kind of authz check in
+the mock API, and that's whether the user has fleet viewer permission. See
+`requireFleetViewer` in [`mock-api/msw/util.ts`](/mock-api/msw/util.ts). All
 operator-related endpoints (i.e., ones that start with `/v1/system`) require
 fleet viewer permissions (at least, but viewer is all we enforce). On other
 resources (i.e., silos and projects) we do not currently do any authz checks in

libs/api/__tests__/hooks.spec.tsx

@@ -11,10 +11,9 @@ import { describe, expect, it, vi } from 'vitest'
 
 import { project } from '@oxide/api-mocks'
 
-import { overrideOnce } from 'app/test/unit'
-
 import { useApiMutation, useApiQuery } from '..'
 import type { DiskCreate } from '../__generated__/Api'
+import { overrideOnce } from '../../../test/unit/server'
 
 // because useApiQuery and useApiMutation are almost entirely typed wrappers
 // around React Query's useQuery and useMutation, these tests are mostly about

libs/api/__tests__/safety.spec.ts

@@ -33,22 +33,19 @@ const grepFiles = (s: string) =>
     .filter((f) => !/safety\.spec\.ts/.test(f)) // this file doesn't count
 
 it('@oxide/api-mocks is only referenced in test files', () => {
-  const files = grepFiles('api-mocks')
-  expect(files).toMatchInlineSnapshot(`
+  expect(grepFiles('api-mocks')).toMatchInlineSnapshot(`
     [
-      "README.md",
       "app/msw-mock-api.ts",
-      "app/test/e2e/instance-create.e2e.ts",
-      "app/test/e2e/inventory.e2e.ts",
-      "app/test/e2e/profile.e2e.ts",
-      "app/test/e2e/project-access.e2e.ts",
-      "app/test/e2e/silo-access.e2e.ts",
-      "app/test/e2e/utils.ts",
-      "app/test/unit/server.ts",
-      "app/test/unit/setup.ts",
-      "docs/mock-api-differences.md",
-      "libs/api-mocks/msw/db.ts",
       "libs/api/__tests__/hooks.spec.tsx",
+      "mock-api/msw/db.ts",
+      "test/e2e/instance-create.e2e.ts",
+      "test/e2e/inventory.e2e.ts",
+      "test/e2e/profile.e2e.ts",
+      "test/e2e/project-access.e2e.ts",
+      "test/e2e/silo-access.e2e.ts",
+      "test/e2e/utils.ts",
+      "test/unit/server.ts",
+      "test/unit/setup.ts",
       "tools/start_mock_api.ts",
       "tsconfig.json",
     ]
@@ -66,8 +63,8 @@ const listFiles = (s: string) =>
   execSync(`git ls-files | grep "${s}"`).toString().trim().split('\n')
 
 // avoid accidentally making an e2e file in the wrong place
-it('e2e tests are only in app/test/e2e', () => {
+it('e2e tests are only in test/e2e', () => {
   for (const file of listFiles('\\.e2e\\.')) {
-    expect(file).toMatch(/^app\/test\/e2e/)
+    expect(file).toMatch(/^test\/e2e/)
   }
 })

playwright.config.ts

@@ -11,7 +11,7 @@ import { devices, type PlaywrightTestConfig } from '@playwright/test'
  * See https://playwright.dev/docs/test-configuration.
  */
 const config: PlaywrightTestConfig = {
-  testDir: './app/test/e2e',
+  testDir: './test/e2e',
   testMatch: /\.e2e\.ts/,
   // Fail the build on CI if you accidentally left test.only in the source code
   forbidOnly: !!process.env.CI,

tsconfig.json

@@ -16,7 +16,7 @@
       "app/*": ["app/*"],
       "@oxide/gen/*": ["libs/api/__generated__/*"],
       "@oxide/api": ["libs/api/index.ts"],
-      "@oxide/api-mocks": ["libs/api-mocks/index.ts"],
+      "@oxide/api-mocks": ["mock-api/index.ts"],
       "@oxide/ui": ["app/ui/index.ts"],
       "@oxide/util": ["libs/util/index.ts"],
       "@oxide/table": ["app/table/index.ts"]

vite.config.ts

@@ -144,7 +144,7 @@ export default defineConfig(({ mode }) => ({
   },
   test: {
     environment: 'jsdom',
-    setupFiles: ['app/test/unit/setup.ts'],
+    setupFiles: ['test/unit/setup.ts'],
     includeSource: ['app/**/*.ts', 'libs/**/*.ts'],
   },
 }))