Umbraco-cms: Multi Url Picker does not render external links correctly if user does not include http as part of Link Url

[lesley-w]

A brief description of the issue goes here.

If a user creates a link using Multi Url Picker but does not include http or https in the url, the link renders the url as "siteurl" + "linkurl" e.g. http://www.mysite.com/www.facebook.com, which results in a broken link.

The url picker know that it is an external link, so should add http:// as a default if it has not been specified e.g. http://www.facebook.com

Please fill out the rest of the details in the issue template below.
The more details you can give us, the easier it will be for us
to determine the cause of a problem.

-->

Umbraco version

I am seeing this issue on Umbraco version: 8.6.4

Reproduction

If you're filing a bug, please describe how to reproduce it. Include as much
relevant information as possible, such as:

Bug summary

If a user creates a link using Multi Url Picker but does not include http or https in the url, the link renders the url as "siteurl" + "linkurl" e.g. http://www.mysite.com/www.facebook.com.
The url picker know that it is an external link, so should add http:// as a default if it has not been specified e.g. http://www.facebook.com

Specifics

Steps to reproduce

Create a link using Multi Url Picker data type, but don't inlcude http in the url.
Render link. It will render Url as http://www.mysite.com/www.facebook.com, which creates a broken link

Expected result

If Link.Type = LinkType.External and url does not begin with http or https, add http:// to start of url
Render link will render Url as http://www.facebook.com

Actual result

Create a link using Multi Url Picker data type, but don't inlcude http in the url e.g. www.facebook.com
Render link will render Url as http://www.mysite.com/www.facebook.com, which creates a broken link

[nathanwoulfe]

Hi @lesley-w I can confirm the same happening on the latest v8 code - no protocol on the external URL results in a relative link being created.

Will mark as up-for-grabs.

[umbrabot]

Hi @lesley-w,

We're writing to let you know that we would love some help with this issue. We feel that this issue is ideal to flag for a community member to work on it. Once flagged here, folk looking for issues to work on will know to look at yours. Of course, please feel free work on this yourself ;-). If there are any changes to this status, we'll be sure to let you know.

For more information about issues and states, have a look at this blog post

Thanks muchly, from your friendly Umbraco GitHub bot :-)

[jordanc44]

I got this one!

[ronaldbarendse]

Yes, this is an issue, but more with incorrect input, instead of Umbraco not doing the right thing with the URL, see https://github.com/umbraco/Umbraco-CMS/pull/9029#issuecomment-702715828.

[jesperweber]

As input, an alignment with the RTE editor would be nice.

In the RTE if you enter an external url as "google.com" the generated url will be "/umbraco/google.com". If you enter "www.google.com" the generated url would be "http://www.google.com".

I agree with @ronaldbarendse the fix should be to ensure editors enter correct URIs.

[ronaldbarendse]

We could fix this by adding validation to the URL field, although it's quite hard to get it right, because there are a lot of formats that must be supported. At least the following:

• http/https, FTP, etc.
• mailto, tel
• /relative
• ?only=querystring
• #only-fragment

Because page relative URLs (not starting with /) don't make sense, this would prevent entering wrong URLs (e.g. a domain name without scheme).

[ronaldbarendse]

The most basic thing to add would be some 'soft validation' whenever the URL starts with www., alerting the editor to add the right scheme (either http or https).

[simonwatt]

The most basic thing to add would be some 'soft validation' whenever the URL starts with www., alerting the editor to add the right scheme (either http or https).

So if someone then enters 'facebook.com' instead of 'www.facebook.com' the issue would still exist? I think it would make more sense to only add the scheme if no known valid schemes (such as the ones you listed above) exist in the input, leaning towards just adding http by default (since most https sites will auto redirect the http version to https anyway).

[ronaldbarendse]

So if someone then enters 'facebook.com' instead of 'www.facebook.com' the issue would still exist?

In the most basic proposition from above, yes... But it could just as easily show the validation message when it can't find a scheme (/^[a-z]+:/) and the URL doesn't start with a slash, query string or fragment (/^(\/|\?|#)/). My biggest concern is Umbraco preventing the entered value to be saved or (even worse) change the returned value that's already saved!

I think it would make more sense to only add the scheme if no known valid schemes

If that makes sense for you, you can already override the default MultiUrlPickerValueConverter with your own and add the scheme to the external URLs 👍

[protherj]

What if there was a small schema selection dropdown in front of the link textbox that allows the content editor to select the scheme. In addition, the Javascript could watch for editors pasting a url into the link text and parse out the scheme if available or just set it to "/" if its not present.

Something like this:

I think this can reduce errors by the editors without being help text that they won't read. Also, it could be configurable as well so devs could setup the schemes they want to allow.

Thoughts?

[glombek]

Any option ought to support custom URL schemes too - for deep linking into apps etc.

With the dropdown box option, this could be solved with a "Custom" option which would effectively re-enable the current functionality. As an added niecety, if the available schemes were stored in config, a developer could enable specific custom schemes.