add more tests

e2e-tests/whiteboards.spec.ts

@@ -106,6 +106,42 @@ test('copy/paste url to create an iFrame', async ({ page }) => {
   await expect( page.locator('.logseq-tldraw .tl-iframe-container')).toHaveCount(1)
 })
 
+test('copy/paste twitter status url to create a Tweet', async ({ page }) => {
+  const canvas = await page.waitForSelector('.logseq-tldraw')
+  const bounds = (await canvas.boundingBox())!
+
+  await page.keyboard.press('t')
+  await page.mouse.move(bounds.x + 5, bounds.y + 5)
+  await page.mouse.down()
+
+  await page.keyboard.type('https://twitter.com/logseq/status/1605224589046386689')
+  await page.keyboard.press(modKey + '+a')
+  await page.keyboard.press(modKey + '+c')
+  await page.keyboard.press('Escape')
+
+  await page.keyboard.press(modKey + '+v')
+
+  await expect( page.locator('.logseq-tldraw .tl-tweet-container')).toHaveCount(1)
+})
+
+test('copy/paste youtube video url to create a Youtube embed', async ({ page }) => {
+  const canvas = await page.waitForSelector('.logseq-tldraw')
+  const bounds = (await canvas.boundingBox())!
+
+  await page.keyboard.press('t')
+  await page.mouse.move(bounds.x + 5, bounds.y + 5)
+  await page.mouse.down()
+
+  await page.keyboard.type('https://www.youtube.com/watch?v=hz2BacySDXE')
+  await page.keyboard.press(modKey + '+a')
+  await page.keyboard.press(modKey + '+c')
+  await page.keyboard.press('Escape')
+
+  await page.keyboard.press(modKey + '+v')
+
+  await expect( page.locator('.logseq-tldraw .tl-youtube-container')).toHaveCount(1)
+})
+
 test('cleanup the shapes', async ({ page }) => {
   await page.keyboard.press(`${modKey}+a`)
   await page.keyboard.press('Delete')

tldraw/apps/tldraw-logseq/src/lib/shapes/TweetShape.tsx

@@ -83,7 +83,7 @@ export class TweetShape extends TLBoxShape<TweetShapeProps> {
         {...events}
       >
         <div
-          className="rounded-xl w-full h-full relative shadow-xl"
+          className="rounded-xl w-full h-full relative shadow-xl tl-tweet-container"
           style={{
             pointerEvents: isEditing ? 'all' : 'none',
             userSelect: 'none',

tldraw/apps/tldraw-logseq/src/lib/shapes/YouTubeShape.tsx

@@ -54,7 +54,7 @@ export class YouTubeShape extends TLBoxShape<YouTubeShapeProps> {
         {...events}
       >
         <div
-          className="rounded-lg w-full h-full relative overflow-hidden shadow-xl"
+          className="rounded-lg w-full h-full relative overflow-hidden shadow-xl tl-youtube-container"
           style={{
             pointerEvents: isEditing ? 'all' : 'none',
             userSelect: 'none',