e2e/acceptance/api-token: Migrate from mirage to @crates-io/msw

Author: Turbo87

e2e/acceptance/api-token.spec.ts

@@ -1,38 +1,37 @@
-import { test, expect } from '@/e2e/helper';
+import { expect, test } from '@/e2e/helper';
+import { http, HttpResponse } from 'msw';
 
 test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
-  test.beforeEach(async ({ mirage }) => {
-    await mirage.addHook(server => {
-      let user = server.create('user', {
-        login: 'johnnydee',
-        name: 'John Doe',
-        email: '[email protected]',
-        avatar: 'https://avatars2.githubusercontent.com/u/1234567?v=4',
-      });
-      server.create('api-token', {
-        user,
-        name: 'BAR',
-        createdAt: '2017-11-19T17:59:22',
-        lastUsedAt: null,
-        expiredAt: '2017-12-19T17:59:22',
-      });
-
-      server.create('api-token', {
-        user,
-        name: 'recently expired',
-        createdAt: '2017-08-01T12:34:56',
-        lastUsedAt: '2017-11-02T01:45:14',
-        expiredAt: '2017-11-19T17:59:22',
-      });
-      server.create('api-token', {
-        user,
-        name: 'foo',
-        createdAt: '2017-08-01T12:34:56',
-        lastUsedAt: '2017-11-02T01:45:14',
-      });
-
-      globalThis.authenticateAs(user);
+  test.beforeEach(async ({ msw }) => {
+    let user = msw.db.user.create({
+      login: 'johnnydee',
+      name: 'John Doe',
+      email: '[email protected]',
+      avatar: 'https://avatars2.githubusercontent.com/u/1234567?v=4',
     });
+    msw.db.apiToken.create({
+      user,
+      name: 'BAR',
+      createdAt: '2017-11-19T17:59:22',
+      lastUsedAt: null,
+      expiredAt: '2017-12-19T17:59:22',
+    });
+
+    msw.db.apiToken.create({
+      user,
+      name: 'recently expired',
+      createdAt: '2017-08-01T12:34:56',
+      lastUsedAt: '2017-11-02T01:45:14',
+      expiredAt: '2017-11-19T17:59:22',
+    });
+    msw.db.apiToken.create({
+      user,
+      name: 'foo',
+      createdAt: '2017-08-01T12:34:56',
+      lastUsedAt: '2017-11-02T01:45:14',
+    });
+
+    await msw.authenticateAs(user);
   });
 
   test('/me is showing the list of active API tokens', async ({ page }) => {
@@ -72,16 +71,13 @@ test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
     await expect(row3.locator('[data-test-token]')).toHaveCount(0);
   });
 
-  test('API tokens can be revoked', async ({ page }) => {
+  test('API tokens can be revoked', async ({ page, msw }) => {
     await page.goto('/settings/tokens');
     await expect(page).toHaveURL('/settings/tokens');
     await expect(page.locator('[data-test-api-token]')).toHaveCount(3);
 
     await page.click('[data-test-api-token="1"] [data-test-revoke-token-button]');
-    expect(
-      await page.evaluate(() => server.schema['apiTokens'].all().length),
-      'API token has been deleted from the backend database',
-    ).toBe(2);
+    expect(msw.db.apiToken.findMany({}).length, 'API token has been deleted from the backend database').toBe(2);
 
     await expect(page.locator('[data-test-api-token]')).toHaveCount(2);
     await expect(page.locator('[data-test-api-token="2"]')).toBeVisible();
@@ -97,12 +93,10 @@ test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
     await expect(page).toHaveURL('/settings/tokens/new?from=1');
   });
 
-  test('failed API tokens revocation shows an error', async ({ page, mirage }) => {
-    await mirage.addHook(server => {
-      server.delete('/api/v1/me/tokens/:id', {}, 500);
-    });
+  test('failed API tokens revocation shows an error', async ({ page, msw }) => {
+    await msw.worker.use(http.delete('/api/v1/me/tokens/:id', () => HttpResponse.json({}, { status: 500 })));
 
-    await mirage.page.goto('/settings/tokens');
+    await page.goto('/settings/tokens');
     await expect(page).toHaveURL('/settings/tokens');
     await expect(page.locator('[data-test-api-token]')).toHaveCount(3);
 
@@ -115,7 +109,7 @@ test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
     );
   });
 
-  test('new API tokens can be created', async ({ page, percy }) => {
+  test('new API tokens can be created', async ({ page, percy, msw }) => {
     await page.goto('/settings/tokens');
     await expect(page).toHaveURL('/settings/tokens');
     await expect(page.locator('[data-test-api-token]')).toHaveCount(3);
@@ -129,7 +123,7 @@ test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
 
     await page.click('[data-test-generate]');
 
-    let token = await page.evaluate(() => server.schema['apiTokens'].findBy({ name: 'the new token' })?.token);
+    let token = msw.db.apiToken.findFirst({ where: { name: { equals: 'the new token' } } })?.token;
     expect(token, 'API token has been created in the backend database').toBeTruthy();
 
     await expect(page.locator('[data-test-api-token="4"] [data-test-name]')).toHaveText('the new token');
@@ -140,14 +134,14 @@ test.describe('Acceptance | api-tokens', { tag: '@acceptance' }, () => {
     await expect(page.locator('[data-test-token]')).toHaveText(token);
   });
 
-  test('API tokens are only visible in plaintext until the page is left', async ({ page }) => {
+  test('API tokens are only visible in plaintext until the page is left', async ({ page, msw }) => {
     await page.goto('/settings/tokens');
     await page.click('[data-test-new-token-button]');
     await page.fill('[data-test-name]', 'the new token');
     await page.click('[data-test-scope="publish-update"]');
     await page.click('[data-test-generate]');
 
-    let token = await page.evaluate(() => server.schema['apiTokens'].findBy({ name: 'the new token' })?.token);
+    let token = msw.db.apiToken.findFirst({ where: { name: { equals: 'the new token' } } })?.token;
     await expect(page.locator('[data-test-token]')).toHaveText(token);
 
     // leave the API tokens page