LinkControl - improve "valid entry" matching (not always a URL!)

[getdave]

Originally posted by @WunderBart in #19458 (comment)

I don't think we should suggest creating a link out of (almost) any string as it can often lead to creating invalid URLs. Instead, we could validate the value while typing and suggest creating a nav link with it only when it's a valid URL. The validation could be done using the URL constructor, like this:

function isValidURL(string) {
  try {
    new URL(string);
    return true;
  } catch (_) {
    return false;  
  }
}

We'd also have more control over what we want to render as a link title using created URL object properties.
I've made a simple fiddle with the validation demo: https://jsfiddle.net/wunderbart/xn01pscd/

Notes

This might not be as simple as outlined above because we need to account for entries including:

• mailto:
• tel
• #internal-anchors`

None of these pass the new URL() test.

@WunderBart I'm all for improving the "valid entry" logic but we need to be mindful that valid input isn't only pure URLs.

[WunderBart]

Thanks for creating the issue, @getdave.

None of these pass the new URL() test.

I ran each one of those through new URL() and they all returned as valid URLs:

new URL("mailto:[email protected]")
// -> URL {href: "mailto:name@domain.com"", ...

new URL("tel:123123123")
// -> URL {href: "tel:123123123", ...

new URL("#anchor-test")
// -> URL {href: "about:blank#anchor-test", ...

Did it throw errors for you?

[getdave]

@WunderBart We might need this in place to properly achieve the requirements for #18900 so let's keep an eye on it.

[aduth]

I marked #19823 as closing this issue. Let me know if that's not correct (or feel free to edit the pull request comment to remove the auto-closing text).