[RPP]: Add a test for the nuances in TimelineUIUtils url regex.

Bug: 436356278
Change-Id: I1f3ad2abe5f4be8636f0f8d82846739a892bc961
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6922732
Commit-Queue: Finnur Thorarinsson <[email protected]>
Reviewed-by: Paul Irish <[email protected]>

Author: finnurbreki

front_end/panels/timeline/TimelineUIUtils.test.ts

@@ -1872,4 +1872,55 @@ in the middle or at the end: <button class="devtools-link text-button link-style
           'so data:text/html,%3Cscript%3Ealert%28%27hi%27%29%3B%3C%2Fscript%3E and www.site.com remain plain');
     });
   });
+
+  describe('URL regex in parseStringForLinks', () => {
+    const urlRegex = Timeline.TimelineUIUtils.URL_REGEX;
+
+    const testCases: Array<{url: string, matches: boolean}> = [
+      // Matching URLs:
+      {url: 'http://example.com', matches: true},
+      {url: 'https://example.com', matches: true},
+      {url: 'https://www.xn--examl-gsa.com', matches: true},
+      {url: 'https://example.com/path/to/resource', matches: true},
+      {url: 'https://example.com?query=param&another=param', matches: true},
+      {url: 'https://example.com#fragment', matches: true},
+      {url: 'ftp://files.example.com', matches: true},
+      {url: 'custom-scheme://resource/123', matches: true},
+      {url: 'ext://node/123', matches: true},
+      {url: 'http://a.z', matches: true},
+      {url: '9http://example.com', matches: true},
+      // URLs with trailing punctuation should still match the URL part.
+      {url: 'https://example.com(', matches: true},
+      {url: 'https://example.com)', matches: true},
+      {url: 'https://example.com[', matches: true},
+      {url: 'https://example.com]', matches: true},
+      {url: 'https://example.com{', matches: true},
+      {url: 'https://example.com}', matches: true},
+      {url: 'https://example.com,', matches: true},
+      {url: 'https://example.com:', matches: true},
+      {url: 'https://example.com;', matches: true},
+      {url: 'https://example.com.', matches: true},
+      {url: 'https://example.com!', matches: true},
+      {url: 'https://example.com?', matches: true},
+
+      // Non-matching strings:
+      {url: 'www.example.com', matches: false},
+      {url: 'example.com', matches: false},
+      {url: 'data:text/html,hello', matches: false},
+      {url: 'mailto:[email protected]', matches: false},
+      {url: 'javascript:void(0)', matches: false},
+      {url: 'not a url', matches: false},
+      {url: 'http://', matches: false},
+      {url: 'https://a', matches: false},
+      {url: 'http://a .com', matches: false},
+      {url: 'http://a".com', matches: false},
+      {url: 'ht://example.com)', matches: false},  // protocol must be 3 or more letters.
+    ];
+
+    for (const {url, matches} of testCases) {
+      it(`correctly validates "${url}" as ${matches ? 'matching' : 'not matching'}`, () => {
+        assert.strictEqual(urlRegex.test(url), matches);
+      });
+    }
+  });
 });

front_end/panels/timeline/TimelineUIUtils.ts

@@ -476,6 +476,9 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('panels/timeline/TimelineUIUtils.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
+// Look for scheme:// plus text and exclude any punctuation at the end.
+export const URL_REGEX = /(?:[a-zA-Z][a-zA-Z0-9+.-]{2,}:\/\/)[^\s"]{2,}[^\s"'\)\}\],:;.!?]/u;
+
 let eventDispatchDesciptors: EventDispatchTypeDescriptor[];
 
 let colorGenerator: Common.Color.Generator;
@@ -897,9 +900,7 @@ export class TimelineUIUtils {
    * of the link is the URL, so the visible string to the user is unchanged.
    */
   static parseStringForLinks(rawString: string): DocumentFragment {
-    // Look for scheme:// plus text and exclude any punctuation at the end.
-    const urlRegex = /(?:[a-zA-Z][a-zA-Z0-9+.-]{2,}:\/\/)[^\s"]{2,}[^\s"'\)\}\],:;.!?]/u;
-    const results = TextUtils.TextUtils.Utils.splitStringByRegexes(rawString, [urlRegex]);
+    const results = TextUtils.TextUtils.Utils.splitStringByRegexes(rawString, [URL_REGEX]);
     const nodes = results.map(result => {
       if (result.regexIndex === -1) {
         return result.value;