add test for registration of new user

playwright.config-local.ts

@@ -74,7 +74,7 @@ export default defineConfig({
 
   /* Configure global timeout; default is 30000 milliseconds */
   // the image upload will often not succeed at 5 seconds
-  timeout: 20000,
+  // timeout: 10000,
 
   /* Run your local dev server before starting the tests */
   /**

src/views/AccountViewView.vue

@@ -129,7 +129,10 @@
       </div>
 
       <div class="text-slate-500 text-sm font-bold">ID</div>
-      <div class="text-sm text-slate-500 flex justify-start items-center mb-1">
+      <div
+        class="text-sm text-slate-500 flex justify-start items-center mb-1"
+        data-testId="didWrapper"
+      >
         <code class="truncate">{{ activeDid }}</code>
         <button
           @click="

src/views/NewIdentifierView.vue

@@ -22,8 +22,8 @@
     </div>
 
     <div class="flex justify-center py-12">
-      <span />
-      <span v-if="loading">
+      <div />
+      <div v-if="loading">
         <span class="text-xl">Creating...&nbsp;</span>
         <fa
           icon="spinner"
@@ -31,8 +31,8 @@
           color="green"
           size="128"
         ></fa>
-      </span>
-      <span v-else>
+      </div>
+      <div v-else>
         <span class="text-xl">Created!</span>
         <fa
           icon="burst"
@@ -45,8 +45,8 @@
             --fa-beat-scale: 6;
           "
         ></fa>
-      </span>
-      <span />
+      </div>
+      <div />
     </div>
   </section>
 </template>

src/views/StartView.vue

@@ -58,6 +58,7 @@
           <a
             @click="onClickNewSeed()"
             class="block w-full text-center text-lg uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md mb-2 cursor-pointer"
+            data-testId="newSeed"
           >
             Generate one with a new seed
           </a>

test-playwright/00-noid-tests.spec.ts

@@ -1,4 +1,5 @@
 import { test, expect } from '@playwright/test';
+import { generateEthrUser, importUser } from './testUtils';
 
 test('Confirm usage of test API (may fail if you are running your own Time Safari)', async ({ page }, testInfo) => {
   // Load account view
@@ -79,3 +80,18 @@ test('Check ID generation', async ({ page }) => {
   // Check that ID is now generated
   await expect(page.locator('#sectionIdentityDetails code.truncate')).toContainText('did:ethr:');
 });
+
+test('Check User 0 can register random person', async ({ page }) => {
+  await importUser(page, '00');
+  const newDid = await generateEthrUser(page);
+  expect(newDid).toContain('did:ethr:');
+
+  await page.goto('./');
+  await page.getByRole('heading', { name: 'Unnamed/Unknown' }).click();
+  await page.getByPlaceholder('What was given').fill('Access!');
+  await page.getByRole('button', { name: 'Sign & Send' }).click();
+  await expect(page.getByText('That gift was recorded.')).toBeVisible();
+  // now ensure that alert goes away
+  await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss alert
+  await expect(page.getByText('That gift was recorded.')).toBeHidden();
+});

test-playwright/10-check-usage-limits.spec.ts

@@ -7,12 +7,22 @@ test('Check usage limits', async ({ page }) => {
   await expect(page.locator('div.bg-slate-100.rounded-md').filter({ hasText: 'Usage Limits' })).toBeHidden();
 
   // Import user 01
-  await importUser(page, '01');
+  const did = await importUser(page, '01');
 
   // Verify that "Usage Limits" section is visible
   await expect(page.locator('#sectionUsageLimits')).toBeVisible();
+  await expect(page.locator('#sectionUsageLimits')).toContainText('You have done');
+  await expect(page.locator('#sectionUsageLimits')).toContainText('You have uploaded');
+
   await expect(page.getByText('Your claims counter resets')).toBeVisible();
   await expect(page.getByText('Your registration counter resets')).toBeVisible();
   await expect(page.getByText('Your image counter resets')).toBeVisible();
   await expect(page.getByRole('button', { name: 'Recheck Limits' })).toBeVisible();
+
+  // Set name
+  await page.getByRole('link', { name: 'Set Your Name' }).click();
+  const name = 'User ' + did.slice(11, 14);
+  await page.getByPlaceholder('Name').fill(name);
+  await page.getByRole('button', { name: 'Save Changes' }).click();
+
 });

test-playwright/40-add-contact.spec.ts

@@ -2,6 +2,7 @@ import { test, expect } from '@playwright/test';
 import { importUser } from './testUtils';
 
 test('Add contact, record gift, confirm gift', async ({ page }) => {
+
   // Generate a random string of 16 characters
   let randomString = Math.random().toString(36).substring(2, 18);
 
@@ -31,8 +32,10 @@ test('Add contact, record gift, confirm gift', async ({ page }) => {
   await page.getByPlaceholder('URL or DID, Name, Public Key').fill('did:ethr:0x0000694B58C2cC69658993A90D3840C560f2F51F, User #000');
   await page.locator('button > svg.fa-plus').click();
   await expect(page.locator('div[role="alert"]')).toBeVisible();
+  await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss alert
+  await expect(page.locator('div[role="alert"] button > svg.fa-xmark')).toBeHidden(); // ensure alert is gone
 
-  await page.locator('div[role="alert"] button:has-text("Yes")').click();
+  await page.locator('div[role="alert"] button:has-text("Cancel")').click();
 
   // Verify added contact
   await expect(page.locator('li.border-b')).toContainText('User #000');

test-playwright/testUtils.ts

@@ -1,6 +1,9 @@
 import { expect, Page } from '@playwright/test';
 
-export async function importUser(page: Page, id?: string): Promise<void> {
+// Import the seed and switch to the user based on the ID.
+// '01' -> 111
+// otherwise -> 000
+export async function importUser(page: Page, id?: string): Promise<string> {
   let seedPhrase, userName, did;
 
   // Set seed phrase and DID based on user ID
@@ -21,14 +24,45 @@ export async function importUser(page: Page, id?: string): Promise<void> {
   await page.getByText('You have a seed').click();
   await page.getByPlaceholder('Seed Phrase').fill(seedPhrase);
   await page.getByRole('button', { name: 'Import' }).click();
-  await expect(page.locator('#sectionUsageLimits')).toContainText('You have done');
-  await expect(page.locator('#sectionUsageLimits')).toContainText('You have uploaded');
-
-  // Set name
-  await page.getByRole('link', { name: 'Set Your Name' }).click();
-  await page.getByPlaceholder('Name').fill(userName);
-  await page.getByRole('button', { name: 'Save Changes' }).click();
 
   // Check DID
   await expect(page.getByRole('code')).toContainText(did);
+  // ... and ensure the app retrieves the registration status
+  await expect(page.getByText('Your claims counter resets')).toBeVisible();
+  return did;
+}
+
+// This is to switch to someone already in the identity table. It doesn't include registration.
+export async function switchToUser(page: Page, did: string): Promise<void> {
+  await page.goto('./account');
+  await page.getByRole('heading', { name: 'Advanced' }).click();
+  await page.getByRole('link', { name: 'Switch Identifier' }).click();
+  await page.getByRole('code', { name: did }).click();
+}
+
+// Generate a new random user and register them.
+// Note that this makes 000 the active user. Use switchToUser to switch to this DID.
+export async function generateEthrUser(page: Page): Promise<string> {
+  await page.goto('./start');
+  await page.getByTestId('newSeed').click();
+  await expect(page.locator('span:has-text("Created")')).toBeVisible();
+
+  await page.goto('./account');
+  // wait until the DID shows on the page in the 'did' element
+  const didElem = await page.getByTestId('didWrapper').locator('code:has-text("did:")');
+  const newDid = await didElem.innerText();
+
+  await importUser(page, '000'); // switch to user 000
+
+  await page.goto('./contacts');
+  const threeChars = newDid.slice(11, 14);
+  await page.getByPlaceholder('URL or DID, Name, Public Key').fill(`${newDid}, User ${threeChars}`);
+  await page.locator('button > svg.fa-plus').click();
+  await page.locator('li', { hasText: threeChars }).click();
+  // register them
+  await page.locator('div[role="alert"] button:has-text("Yes")').click();
+  // wait for it to disappear because the next steps may depend on alerts being gone
+  await expect(page.locator('div[role="alert"] button:has-text("Yes")')).toBeHidden();
+
+  return newDid;
 }