Warn the user on links that dont match their text (#1573)

* Add link warning modal when URLs do not match their text

* Simplify the misleading link case for clarity

* Fix typecheck

* fix dark mode

* Give a stronger visual indication of the root domain in the link warning

* More rigorous URL mismatch logic

* Remove debug

---------

Co-authored-by: Ansh Nanda <anshnanda10@gmail.com>

1 files changed, 98 insertions, 0 deletions

diff --git a/__tests__/lib/strings/url-helpers.test.ts b/__tests__/lib/strings/url-helpers.test.ts
new file mode 100644
index 000000000..3055a9ef6
--- /dev/null
+++ b/__tests__/lib/strings/url-helpers.test.ts
@@ -0,0 +1,98 @@
+import {
+  linkRequiresWarning,
+  isPossiblyAUrl,
+  splitApexDomain,
+} from '../../../src/lib/strings/url-helpers'
+
+describe('linkRequiresWarning', () => {
+  type Case = [string, string, boolean]
+  const cases: Case[] = [
+    ['http://example.com', 'http://example.com', false],
+    ['http://example.com', 'example.com', false],
+    ['http://example.com', 'example.com/page', false],
+    ['http://example.com', '', true],
+    ['http://example.com', 'other.com', true],
+    ['http://example.com', 'http://other.com', true],
+    ['http://example.com', 'some label', true],
+    ['http://example.com', 'example.com more', true],
+    ['http://example.com', 'http://example.co', true],
+    ['http://example.co', 'http://example.com', true],
+    ['http://example.com', 'example.co', true],
+    ['http://example.co', 'example.com', true],
+    ['http://site.pages.dev', 'http://site.page', true],
+    ['http://site.page', 'http://site.pages.dev', true],
+    ['http://site.pages.dev', 'site.page', true],
+    ['http://site.page', 'site.pages.dev', true],
+    ['http://site.pages.dev', 'http://site.pages', true],
+    ['http://site.pages', 'http://site.pages.dev', true],
+    ['http://site.pages.dev', 'site.pages', true],
+    ['http://site.pages', 'site.pages.dev', true],
+
+    // bad uri inputs, default to true
+    ['', '', true],
+    ['example.com', 'example.com', true],
+  ]
+
+  it.each(cases)(
+    'given input uri %p and text %p, returns %p',
+    (uri, text, expected) => {
+      const output = linkRequiresWarning(uri, text)
+      expect(output).toEqual(expected)
+    },
+  )
+})
+
+describe('isPossiblyAUrl', () => {
+  type Case = [string, boolean]
+  const cases: Case[] = [
+    ['', false],
+    ['text', false],
+    ['some text', false],
+    ['some text', false],
+    ['some domain.com', false],
+    ['domain.com', true],
+    [' domain.com', true],
+    ['domain.com ', true],
+    [' domain.com ', true],
+    ['http://domain.com', true],
+    [' http://domain.com', true],
+    ['http://domain.com ', true],
+    [' http://domain.com ', true],
+    ['https://domain.com', true],
+    [' https://domain.com', true],
+    ['https://domain.com ', true],
+    [' https://domain.com ', true],
+    ['http://domain.com/foo', true],
+    ['http://domain.com stuff', true],
+  ]
+
+  it.each(cases)('given input uri %p, returns %p', (str, expected) => {
+    const output = isPossiblyAUrl(str)
+    expect(output).toEqual(expected)
+  })
+})
+
+describe('splitApexDomain', () => {
+  type Case = [string, string, string]
+  const cases: Case[] = [
+    ['', '', ''],
+    ['example.com', '', 'example.com'],
+    ['foo.example.com', 'foo.', 'example.com'],
+    ['foo.bar.example.com', 'foo.bar.', 'example.com'],
+    ['example.co.uk', '', 'example.co.uk'],
+    ['foo.example.co.uk', 'foo.', 'example.co.uk'],
+    ['example.nonsense', '', 'example.nonsense'],
+    ['foo.example.nonsense', '', 'foo.example.nonsense'],
+    ['foo.bar.example.nonsense', '', 'foo.bar.example.nonsense'],
+    ['example.com.example.com', 'example.com.', 'example.com'],
+  ]
+
+  it.each(cases)(
+    'given input uri %p, returns %p,%p',
+    (str, expected1, expected2) => {
+      const output = splitApexDomain(str)
+      expect(output[0]).toEqual(expected1)
+      expect(output[1]).toEqual(expected2)
+    },
+  )
+})