Skip to content

Commit

Permalink
refactor: use URL API (#8716)
Browse files Browse the repository at this point in the history
* refactor: use URL API

* add relative test

* remove old jsdoc comment

* Corrected test description
  • Loading branch information
mister-ben authored May 3, 2024
1 parent 3e697e9 commit 992af3b
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 103 deletions.
101 changes: 6 additions & 95 deletions src/js/utils/url.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,80 +5,18 @@
import document from 'global/document';
import window from 'global/window';

/**
* @typedef {Object} url:URLObject
*
* @property {string} protocol
* The protocol of the url that was parsed.
*
* @property {string} hostname
* The hostname of the url that was parsed.
*
* @property {string} port
* The port of the url that was parsed.
*
* @property {string} pathname
* The pathname of the url that was parsed.
*
* @property {string} search
* The search query of the url that was parsed.
*
* @property {string} hash
* The hash of the url that was parsed.
*
* @property {string} host
* The host of the url that was parsed.
*/

/**
* Resolve and parse the elements of a URL.
*
* @function
* @param {String} url
* @param {string} url
* The url to parse
*
* @return {url:URLObject}
* @return {URL}
* An object of url details
*/
export const parseUrl = function(url) {
// This entire method can be replace with URL once we are able to drop IE11

const props = ['protocol', 'hostname', 'port', 'pathname', 'search', 'hash', 'host'];

// add the url to an anchor and let the browser parse the URL
const a = document.createElement('a');

a.href = url;

// Copy the specific URL properties to a new object
// This is also needed for IE because the anchor loses its
// properties when it's removed from the dom
const details = {};

for (let i = 0; i < props.length; i++) {
details[props[i]] = a[props[i]];
}

// IE adds the port to the host property unlike everyone else. If
// a port identifier is added for standard ports, strip it.
if (details.protocol === 'http:') {
details.host = details.host.replace(/:80$/, '');
}

if (details.protocol === 'https:') {
details.host = details.host.replace(/:443$/, '');
}

if (!details.protocol) {
details.protocol = window.location.protocol;
}

/* istanbul ignore if */
if (!details.host) {
details.host = window.location.host;
}

return details;
return new URL(url, document.baseURI);
};

/**
Expand All @@ -90,21 +28,9 @@ export const parseUrl = function(url) {
*
* @return {string}
* Absolute URL
*
* @see http://stackoverflow.com/questions/470832/getting-an-absolute-url-from-a-relative-one-ie6-issue
*/
export const getAbsoluteURL = function(url) {
// Check if absolute URL
if (!url.match(/^https?:\/\//)) {
// Add the url to an anchor and let the browser parse it to convert to an absolute url
const a = document.createElement('a');

a.href = url;

url = a.href;
}

return url;
return (new URL(url, document.baseURI)).href;
};

/**
Expand Down Expand Up @@ -139,27 +65,12 @@ export const getFileExtension = function(path) {
* @param {string} url
* The url to check.
*
* @param {Object} [winLoc]
* @param {URL} [winLoc]
* the domain to check the url against, defaults to window.location
*
* @param {string} [winLoc.protocol]
* The window location protocol defaults to window.location.protocol
*
* @param {string} [winLoc.host]
* The window location host defaults to window.location.host
*
* @return {boolean}
* Whether it is a cross domain request or not.
*/
export const isCrossOrigin = function(url, winLoc = window.location) {
const urlInfo = parseUrl(url);

// IE8 protocol relative urls will return ':' for protocol
const srcProtocol = urlInfo.protocol === ':' ? winLoc.protocol : urlInfo.protocol;

// Check if url is for another domain/origin
// IE8 doesn't know location.origin, so we won't rely on it here
const crossOrigin = (srcProtocol + urlInfo.host) !== (winLoc.protocol + winLoc.host);

return crossOrigin;
return parseUrl(url).origin !== winLoc.origin;
};
12 changes: 4 additions & 8 deletions test/unit/utils/url.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,9 +41,8 @@ QUnit.test('should strip port from hosts using http or https', function(assert)
});

QUnit.test('should get an absolute URL', function(assert) {
// Errors on compiled tests that don't use unit.html. Need a better solution.
// assert.ok(Url.getAbsoluteURL('unit.html') === window.location.href);
assert.ok(Url.getAbsoluteURL('http://asdf.com') === 'http://asdf.com');
assert.ok(Url.getAbsoluteURL(window.location.pathname + window.location.search) === window.location.href);
assert.ok(Url.getAbsoluteURL('http://asdf.com') === 'http://asdf.com/');
assert.ok(Url.getAbsoluteURL('https://asdf.com/index.html') === 'https://asdf.com/index.html');
});

Expand Down Expand Up @@ -81,12 +80,9 @@ QUnit.test('isCrossOrigin can identify cross origin urls', function(assert) {
// we cannot test that relative urls work on https, though
assert.ok(!Url.isCrossOrigin('example.vtt'), 'relative url is not cross origin');

const location = {
protocol: 'https:',
host: 'google.com'
};
const location = new URL('https:/google.com');

assert.ok(!Url.isCrossOrigin('https://google.com/example.vtt', location), 'http://google.com from https://google.com is not cross origin');
assert.ok(!Url.isCrossOrigin('https://google.com/example.vtt', location), 'https://google.com from https://google.com is not cross origin');
assert.ok(Url.isCrossOrigin('http://google.com/example.vtt', location), 'http://google.com from https://google.com is cross origin');
assert.ok(Url.isCrossOrigin('http://example.com/example.vtt', location), 'http://example.com from https://google.com is cross origin');
assert.ok(Url.isCrossOrigin('https://example.com/example.vtt', location), 'https://example.com from https://google.com is cross origin');
Expand Down

0 comments on commit 992af3b

Please sign in to comment.