Merge branch 'main' into aditya/add-link-to-heading

Author: callingmedic911

.github/workflows/playwright.yml

@@ -15,7 +15,7 @@ jobs:
     - name: Install Playwright Browsers
       run: npx playwright install --with-deps
     - name: Run Playwright tests
-      run: npx playwright test
+      run: npx playwright test --project replay-chromium
       env:
         BASE_URL: ${{ github.event.deployment_status.target_url }}
         REPLAY_API_KEY: ${{ secrets.REPLAY_API_KEY }}

playwright.config.ts

@@ -1,4 +1,4 @@
-import { PlaywrightTestConfig } from '@playwright/test'
+import { PlaywrightTestConfig, devices } from '@playwright/test'
 import { devices as replayDevices } from '@replayio/playwright'
 import dotenv from 'dotenv';
 dotenv.config();
@@ -22,6 +22,10 @@ const config: PlaywrightTestConfig = {
       name: 'replay-chromium',
       use: { ...(replayDevices['Replay Chromium'] as any) },
     },
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
   ],
 }
 export default config

src/app/ci-workflows/generate-api-key/page.md

@@ -5,8 +5,8 @@ description: Your API key authenticates you with Replay App and allows you to re
 
 ## Creating a new API key
 
-1. To generate a new API key, go to Replay app and open **API Keys** section in the settings window.
-2. Create a label for your API key and click "Add"
+1. To generate a new API key, go to Replay app and **API Keys** section in the team settings section.
+2. Add permissions and name to your API key and click "Add"
 3. Copy your API key
 
 {% video src="generateApiKey" /%}
@@ -17,7 +17,7 @@ Make sure to copy and save your key immediately as you will not be able to see i
 
 ## Delete API key
 
-Your API keys are accessible in your settings. You can delete any API key if necessary. A list of all active API keys is also available in the settings.
+Your API keys are accessible in your team settings. You can delete any API key if necessary. A list of all active API keys is also available in the team settings.
 
 {% video src="deleteApiKey" /%}
 

src/components/Analytics.tsx

@@ -21,10 +21,6 @@ export default function Analytics() {
         src="/stats/script.js"
         data-website-id="9dab9357-6fa2-48ab-966a-82c4e1bb67fe"
       ></script>
-      <script
-        async
-        src="https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js"
-      ></script>
     </>
   )
 }

src/components/Zoom.tsx

@@ -81,7 +81,7 @@ export const Zoom = ({ children }: {children: React.ReactNode}) => {
           onClick={closeWrapper}
         />
       ) : null}
-      <div data-testid="zoomed-out-player" style={styles} ref={containerRef} onClick={handleImageZoom}>
+      <div data-testid="image-with-zoom" style={styles} ref={containerRef} onClick={handleImageZoom}>
         {children}
       </div>
     </>

src/videos/delete-api-key.mp4.json

@@ -1 +1 @@
-{"status":"ready","originalFilePath":"src/videos/delete-api-key.mp4","provider":"mux","providerMetadata":{"mux":{"uploadId":"uh401pwI8VNSBXb01lRkEuxRgZ201Z70001Hfczp4djVyF100","assetId":"chOyjgGQEPz5GWiz00BQyinKVFbFnqPtBy018P8e00FLJ8","playbackId":"BLAOnX0200Hg6wZl1MWsdKH2q87p4re601I014dQ020155OJs"}},"createdAt":1713199254484,"updatedAt":1713199260142,"size":1625673,"sources":[{"src":"https://stream.mux.com/BLAOnX0200Hg6wZl1MWsdKH2q87p4re601I014dQ020155OJs.m3u8","type":"application/x-mpegURL"}],"poster":"https://image.mux.com/BLAOnX0200Hg6wZl1MWsdKH2q87p4re601I014dQ020155OJs/thumbnail.webp","blurDataURL":"data:image/webp;base64,UklGRoAAAABXRUJQVlA4IHQAAADQAQCdASoQAAkAAQAcJaQAAv+qH8aeAAD+/1vVEycw3//JGua8DD/7dY7HbzWEw9Ju50oZjtlx//wfWmu6NvfMNH8gJv/sQ/+072RhhY/Pcd1/RHf6aMx2+lfbDZQabBJeSBF8ciqcuM99nKsX1c3PBTwAAA=="}
+{"status":"ready","originalFilePath":"src/videos/delete-api-key.mp4","provider":"mux","providerMetadata":{"mux":{"uploadId":"iTabAgrzoPjqAavfVqkwwtjNCsFSwkkmqjQAFfEfsLY","assetId":"b9qnwRn6jx2K2Ya5zR8aSTT4402wr8keUcvD7yYkv4Y8","playbackId":"bVgPOhB71ix02ozUpyKHYbnPCaWLfX62T2zEnOogw6OM"}},"createdAt":1714131534113,"updatedAt":1714131539417,"size":1182619,"sources":[{"src":"https://stream.mux.com/bVgPOhB71ix02ozUpyKHYbnPCaWLfX62T2zEnOogw6OM.m3u8","type":"application/x-mpegURL"}],"poster":"https://image.mux.com/bVgPOhB71ix02ozUpyKHYbnPCaWLfX62T2zEnOogw6OM/thumbnail.webp","blurDataURL":"data:image/webp;base64,UklGRkoAAABXRUJQVlA4ID4AAABwAQCdASoQAAkAAQAcJYwCdAGIQAD+/Ec3GQdKiT/aP+Y542wXBtB2/6QQ6I//qun3XTVlp/5tNhyYmjXwAA=="}

src/videos/generate-api-key.mp4.json

@@ -1 +1 @@
-{"status":"ready","originalFilePath":"src/videos/generate-api-key.mp4","provider":"mux","providerMetadata":{"mux":{"uploadId":"D27TxZ2JV1xr02TaXRtK02l9yEhxXRUrM01CAcu8IzDksU","assetId":"3qHdNCdf5B4XozWPdOCcDw68DdrIcEuh3XrcpjQPGhk","playbackId":"tK5QsHRs2JtARZTguWbClqLoO5IEr6NJiUkNLZUkU400"}},"createdAt":1713171829593,"updatedAt":1713171835448,"size":2015961,"sources":[{"src":"https://stream.mux.com/tK5QsHRs2JtARZTguWbClqLoO5IEr6NJiUkNLZUkU400.m3u8","type":"application/x-mpegURL"}],"poster":"https://image.mux.com/tK5QsHRs2JtARZTguWbClqLoO5IEr6NJiUkNLZUkU400/thumbnail.webp","blurDataURL":"data:image/webp;base64,UklGRlAAAABXRUJQVlA4IEQAAADwAQCdASoQAAkAAQAcJZwC7AEPAj+x6RAA/v8g9WXl8CmWu3VA51u9r5dfxpio4Quf1tiKgz42kMT0X0ab/LiJVSoAAA=="}
+{"status":"ready","originalFilePath":"src/videos/generate-api-key.mp4","provider":"mux","providerMetadata":{"mux":{"uploadId":"KFSFWzjfkpm01q7Y2UFdk7ODiQeW28izTlFBZWOw00ZTE","assetId":"ktDpMY9cuo4pTOHownyWju59kLP6geot4CsQprz7UTU","playbackId":"ISWXuMOvC6HyJXLIdwF02Fd501cVZcUTYbNO5h01xCqsGg"}},"createdAt":1714131388968,"updatedAt":1714131393374,"size":2258834,"sources":[{"src":"https://stream.mux.com/ISWXuMOvC6HyJXLIdwF02Fd501cVZcUTYbNO5h01xCqsGg.m3u8","type":"application/x-mpegURL"}],"poster":"https://image.mux.com/ISWXuMOvC6HyJXLIdwF02Fd501cVZcUTYbNO5h01xCqsGg/thumbnail.webp","blurDataURL":"data:image/webp;base64,UklGRloAAABXRUJQVlA4IE4AAABQAgCdASoQAAkAAQAcJYwCdBHABl83XIS/RgAA/v6RUPH3K8ojs72tidensT3sRxE8q6QX2uD7KIAj4nzTPcJ23gMM2LSz/hqQApYAAAA="}

tests/navigation.spec.ts

@@ -4,14 +4,14 @@ test('navigation expanding works', async ({ page }) => {
 
   await page.goto('/')
   await page.getByText('Intro to time travel').click()
-  const navigationItem = page.getByText('What is time travel?', {exact: true})
+  const navigationItem = page.getByText('Why time travel?')
   await expect(navigationItem).toBeVisible()
 
 })
 
 test('navigation collapsing works', async ({ page }) => {
 
-  await page.goto('/time-travel-intro/what-is-time-travel')
+  await page.goto('/time-travel-intro/why-time-travel')
   // sidebar items are expanded
   const navigationItem = page.getByText('Annotate the timeline', {exact: true})
   await expect(navigationItem).toBeVisible()

tests/zoomPlayer.spec.ts

@@ -1,16 +1,18 @@
 import { test, expect } from '@playwright/test'
 
-test.skip('player zoom in', async ({ page }) => {
+test('player zoom in', async ({ page }) => {
 
   await page.goto('/test-runners/playwright/debugging-tests')
 
-  const playerZoomedOut = page.locator('[data-testid="zoomed-out-player"]').first() 
-  await playerZoomedOut.click()
+  const image = page.locator('[data-testid="image-with-zoom"]').first()
+  await image.scrollIntoViewIfNeeded() 
+  await image.click()
 
   const playerZoomedIn = page.locator('[data-testid="zoomed-in-player"]')
+  await playerZoomedIn.scrollIntoViewIfNeeded() 
   await expect(playerZoomedIn).toHaveCount(1)
 
-  playerZoomedIn.click()
+  await image.click()
   await expect(playerZoomedIn).toHaveCount(0)
 
 })