Add unit test for video parse (#442)

Co-authored-by: Tomek Zawadzki <[email protected]>
Expensify · Aug 1, 2024 · b0a5ce1 · b0a5ce1
1 parent e07570c
commit b0a5ce1
Show file tree

Hide file tree

Showing 5 changed files with 106 additions and 23 deletions.
diff --git a/parser/__tests__/index.test.ts b/parser/__tests__/index.test.ts
@@ -550,3 +550,86 @@ describe('report mentions', () => {
     expect('reported #report-name!').toBeParsedAs([{type: 'mention-report', start: 9, length: 12}]);
   });
 });
+
+describe('inline video', () => {
+  test('with alt text', () => {
+    expect('![test](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 6, length: 1},
+      {type: 'syntax', start: 7, length: 1},
+      {type: 'link', start: 8, length: 29},
+      {type: 'syntax', start: 37, length: 1},
+    ]);
+  });
+
+  test('without alt text', () => {
+    expect('![](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 2, length: 1},
+      {type: 'syntax', start: 3, length: 1},
+      {type: 'link', start: 4, length: 29},
+      {type: 'syntax', start: 33, length: 1},
+    ]);
+  });
+
+  test('with same alt text as src', () => {
+    expect('![https://example.com/video.mp4](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 31, length: 1},
+      {type: 'syntax', start: 32, length: 1},
+      {type: 'link', start: 33, length: 29},
+      {type: 'syntax', start: 62, length: 1},
+    ]);
+  });
+
+  test('with alt text containing markdown', () => {
+    expect('![# fake-heading *bold* _italic_ ~strike~ [:-)]](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 47, length: 1},
+      {type: 'syntax', start: 48, length: 1},
+      {type: 'link', start: 49, length: 29},
+      {type: 'syntax', start: 78, length: 1},
+    ]);
+  });
+
+  test('trying to pass additional attributes', () => {
+    expect('![test](https://example.com/video.mp4 "title" class="video")').toBeParsedAs([{type: 'link', start: 8, length: 29}]);
+  });
+
+  test('trying to inject additional attributes', () => {
+    expect('![test" onerror="alert(\'xss\')](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 29, length: 1},
+      {type: 'syntax', start: 30, length: 1},
+      {type: 'link', start: 31, length: 29},
+      {type: 'syntax', start: 60, length: 1},
+    ]);
+  });
+
+  test('inline code in alt', () => {
+    expect('![`code`](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 8, length: 1},
+      {type: 'syntax', start: 9, length: 1},
+      {type: 'link', start: 10, length: 29},
+      {type: 'syntax', start: 39, length: 1},
+    ]);
+  });
+
+  test('blockquote in alt', () => {
+    expect('![```test```](https://example.com/video.mp4)').toBeParsedAs([
+      {type: 'syntax', start: 0, length: 1},
+      {type: 'syntax', start: 1, length: 1},
+      {type: 'syntax', start: 12, length: 1},
+      {type: 'syntax', start: 13, length: 1},
+      {type: 'link', start: 14, length: 29},
+      {type: 'syntax', start: 43, length: 1},
+    ]);
+  });
+});
diff --git a/parser/index.ts b/parser/index.ts
@@ -194,12 +194,12 @@ function parseTreeToTextAndRanges(tree: StackItem): [string, Range[]] {
       } else if (node.tag.startsWith('<video data-expensify-source="')) {
         const src = node.tag.match(/data-expensify-source="([^"]*)"/)![1]!; // always present
         const rawLink = node.tag.match(/data-raw-href="([^"]*)"/);
+        const hasAlt = node.tag.match(/data-link-variant="([^"]*)"/)![1] === 'labeled';
         const linkString = rawLink ? Utils.unescapeText(rawLink[1]!) : src;
-        const attachmentName = node.children?.join('')?.replaceAll('&#32;', ' ');
         appendSyntax('!');
-        if (attachmentName) {
+        if (hasAlt) {
           appendSyntax('[');
-          processChildren(Utils.unescapeText(attachmentName || ''));
+          node.children.forEach((child) => processChildren(child));
           appendSyntax(']');
         }
         appendSyntax('(');

diff --git a/parser/package.json b/parser/package.json
@@ -22,6 +22,6 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "expensify-common": "2.0.46"
+    "expensify-common": "2.0.64"
   }
 }
diff --git a/parser/react-native-live-markdown-parser.js b/parser/react-native-live-markdown-parser.js
diff --git a/yarn.lock b/yarn.lock
@@ -2647,7 +2647,7 @@ __metadata:
     "@types/underscore": ^1.11.15
     esbuild: 0.19.4
     esbuild-plugin-tsc: ^0.4.0
-    expensify-common: 2.0.46
+    expensify-common: 2.0.64
     jest: ^29.7.0
     typescript: ^5.3.3
   languageName: unknown
@@ -9967,9 +9967,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"expensify-common@npm:2.0.46":
-  version: 2.0.46
-  resolution: "expensify-common@npm:2.0.46"
+"expensify-common@npm:2.0.64":
+  version: 2.0.64
+  resolution: "expensify-common@npm:2.0.64"
   dependencies:
     awesome-phonenumber: ^5.4.0
     classnames: 2.5.0
@@ -9984,7 +9984,7 @@ __metadata:
     semver: ^7.6.2
     simply-deferred: "git+https://github.com/Expensify/simply-deferred.git#77a08a95754660c7bd6e0b6979fdf84e8e831bf5"
     ua-parser-js: ^1.0.38
-  checksum: f2dd73ac10efc9c8cf512c810c3e07a3a865c1af4dc7742e07449a06ac1d91e4583dff15f79567bbd48e8f6c11ea10f20dd46c680d8f450b960799a881d44115
+  checksum: c58c9404da09be588be799798f03e2c74c5598b069218e6a895b65bb8e7132f11820c4f1b50f8e92fcb39b498f71159d75fadd90112632eac250dd09a346488a
   languageName: node
   linkType: hard