Add playwight test

apps/app/playwright/20-basic-features/click-page-icons.spec.ts

@@ -0,0 +1,49 @@
+import { test, expect } from '@playwright/test';
+
+test('Successfully Subscribe/Unsubscribe a page', async({ page }) => {
+  await page.goto('/Sandbox');
+  const subscribeButton = page.locator('.btn-subscribe');
+
+  // Subscribe
+  await subscribeButton.click();
+  await expect(subscribeButton).toHaveClass(/active/);
+
+  // Unsubscribe
+  await subscribeButton.click();
+  await expect(subscribeButton).not.toHaveClass(/active/);
+});
+
+test('Successfully Like/Unlike a page', async({ page }) => {
+  await page.goto('/Sandbox');
+  const likeButton = page.locator('.btn-like').first();
+
+  // Like
+  await likeButton.click();
+  await expect(likeButton).toHaveClass(/active/);
+
+  // Unlike
+  await likeButton.click();
+  await expect(likeButton).not.toHaveClass(/active/);
+});
+
+test('Successfully Bookmark / Unbookmark a page', async({ page }) => {
+  await page.goto('/Sandbox');
+  const bookmarkButton = page.locator('.btn-bookmark').first();
+
+  // Bookmark
+  await bookmarkButton.click();
+  await expect(bookmarkButton).toHaveClass(/active/);
+
+  // Unbookmark
+  await page.locator('.grw-bookmark-folder-menu-item').click();
+  await expect(bookmarkButton).not.toHaveClass(/active/);
+});
+
+test('Successfully display list of "seen by user"', async({ page }) => {
+  await page.goto('/Sandbox');
+
+  await page.locator('.btn-seen-user').click();
+
+  const imgCount = await page.locator('.user-list-content').locator('img').count();
+  expect(imgCount).toBe(1);
+});