crowd-funder-for-time-pwa/test-playwright/50-record-offer.spec.ts

import { test, expect } from '@playwright/test';
import { importUser } from './testUtils';

test('Record an offer', async ({ page }) => {
  // Generate a random string of 3 characters, skipping the "0." at the beginning
  const randomString = Math.random().toString(36).substring(2, 5);
  // Standard title prefix
  const description = `Offering of ${randomString}`;
  const updatedDescription = `Updated ${description}`;
  const randomNonZeroNumber = Math.floor(Math.random() * 998) + 1;

  // Create new ID for default user
  await importUser(page);

  // Select a project
  await page.goto('./discover');
  await page.getByTestId('closeOnboardingAndFinish').click();
  await page.locator('ul#listDiscoverResults li:nth-child(1)').click();

  // Record an offer
  await page.locator('button', { hasText: 'Edit' }).isVisible(); // since the 'edit' takes longer to show, wait for that (lest the click miss)
  await page.getByTestId('offerButton').click();
  await page.getByTestId('inputDescription').fill(description);
  await page.getByTestId('inputOfferAmount').fill(randomNonZeroNumber.toString());
  await page.getByRole('button', { name: 'Sign & Send' }).click();
  await expect(page.getByText('That offer was recorded.')).toBeVisible();

  // go to the offer and check the values
  await page.goto('./projects');
  await page.getByRole('link', { name: 'Offers', exact: true }).click();
  await page.locator('li').filter({ hasText: description }).locator('a').first().click();
  await expect(page.getByRole('heading', { name: 'Verifiable Claim Details' })).toBeVisible();
  await expect(page.getByText(description, { exact: true })).toBeVisible();
  await expect(page.getByText('Offered to a bigger plan')).toBeVisible();

  const serverPagePromise = page.waitForEvent('popup');
  await page.getByRole('link', { name: 'View on the Public Server' }).click();
  const serverPage = await serverPagePromise;
  await serverPage.getByText(description);
  await serverPage.getByText('did:none:HIDDEN');

  // Now update that offer

  // find the edit page and check the old values again
  await page.goto('./projects');
  await page.getByRole('link', { name: 'Offers', exact: true }).click();
  await page.locator('li').filter({ hasText: description }).locator('a').first().click();
  await page.getByTestId('editClaimButton').click();
  await page.locator('heading', { hasText: 'What is offered' }).isVisible();
  const itemDesc = await page.getByTestId('itemDescription');
  await expect(itemDesc).toHaveValue(description);
  const amount = await page.getByTestId('inputOfferAmount');
  await expect(amount).toHaveValue(randomNonZeroNumber.toString());
  // update the values
  await itemDesc.fill(updatedDescription);
  await amount.fill(String(randomNonZeroNumber + 1));
  await page.getByRole('button', { name: 'Sign & Send' }).click();
  await expect(page.getByText('That offer was recorded.')).toBeVisible();

  // go to the offer claim again and check the updated values
  await page.goto('./projects');
  await page.getByRole('link', { name: 'Offers', exact: true }).click();
  await page.locator('li').filter({ hasText: description }).locator('a').first().click();
  const newItemDesc = await page.getByTestId('description');
  await expect(newItemDesc).toHaveText(updatedDescription);

  // go to edit page
  await page.getByTestId('editClaimButton').click();
  const newAmount = await page.getByTestId('inputOfferAmount');
  await expect(newAmount).toHaveValue((randomNonZeroNumber + 1).toString());

  // go to the home page and check that the offer is shown as new
  await page.goto('./');
  const offerNumElem = page.getByTestId('newOffersToUserProjectsActivityNumber');
  await expect(offerNumElem).toHaveText('50');

  // click on the number of new offers to go to the list page
  await offerNumElem.click();
  await expect(page.getByText('New Offers To Your Projects', { exact: true })).toBeVisible();
  await page.getByTestId('showOffersToUserProjects').click();
  await expect(page.getByText(description)).toBeVisible();

});