Skip to content

Commit da316ac

Browse files
committed
refactor(client): updated to latest module importing
1 parent d86dcf7 commit da316ac

File tree

8 files changed

+136
-98
lines changed

8 files changed

+136
-98
lines changed

client-src/default/index.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,9 @@ import { log, setLogLevel } from './utils/log';
99
import sendMessage from './utils/sendMessage';
1010
import reloadApp from './utils/reloadApp';
1111
import createSocketUrl from './utils/createSocketUrl';
12+
import updatePublicPath from './utils/updatePublicPath';
13+
14+
updatePublicPath(__resourceQuery);
1215

1316
const status = {
1417
isUnloading: false,

client-src/default/utils/createSocketUrl.js

Lines changed: 7 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,93 +1,18 @@
11
import url from 'url';
2-
import querystring from 'querystring';
3-
import getCurrentScriptSource from './getCurrentScriptSource';
2+
import getUrlParts from './getUrlParts';
43

54
function createSocketUrl(resourceQuery) {
6-
let urlParts;
7-
8-
if (typeof resourceQuery === 'string' && resourceQuery !== '') {
9-
// If this bundle is inlined, use the resource query to get the correct url.
10-
urlParts = url.parse(resourceQuery.substr(1));
11-
} else {
12-
// Else, get the url from the <script> this file was called with.
13-
const scriptHost = getCurrentScriptSource();
14-
15-
// it seems the reg exp below was intended to cut off the path of a script source,
16-
// so if you have my.host/long/path as the script source, it would become my.host.
17-
// however, it did not work, because if you had http://my.host/long/path it would
18-
// turn it into http:/. Cutting off the path is no longer needed, since we
19-
// simply do url.parse and pull the host from there.
20-
21-
// eslint-disable-next-line no-useless-escape
22-
// scriptHost = scriptHost.replace(/\/[^\/]+$/, '');
23-
urlParts = url.parse(scriptHost || '/', false, true);
24-
}
25-
26-
if (!urlParts.port || urlParts.port === '0') {
27-
urlParts.port = self.location.port;
28-
}
29-
30-
const { auth, path } = urlParts;
31-
let { hostname, protocol } = urlParts;
32-
33-
// check ipv4 and ipv6 `all hostname`
34-
// why do we need this check?
35-
// hostname n/a for file protocol (example, when using electron, ionic)
36-
// see: https://github.com/webpack/webpack-dev-server/pull/384
37-
const isAnyHostname =
38-
(hostname === '0.0.0.0' || hostname === '::') &&
39-
self.location.hostname &&
40-
// eslint-disable-next-line no-bitwise
41-
!!~self.location.protocol.indexOf('http');
42-
43-
if (isAnyHostname) {
44-
hostname = self.location.hostname;
45-
}
46-
47-
// `hostname` can be empty when the script path is relative. In that case, specifying
48-
// a protocol would result in an invalid URL.
49-
// When https is used in the app, secure websockets are always necessary
50-
// because the browser doesn't accept non-secure websockets.
51-
if (
52-
hostname &&
53-
(self.location.protocol === 'https:' || urlParts.hostname === '0.0.0.0')
54-
) {
55-
protocol = self.location.protocol;
56-
}
57-
58-
// default values of the sock url if they are not provided
59-
const defaultHost = hostname;
60-
const defaultSockPath = '/sockjs-node';
61-
const defaultPort = urlParts.port;
62-
const defaultPublicPath = '/';
63-
64-
let sockHost = defaultHost;
65-
let sockPath = defaultSockPath;
66-
let sockPort = defaultPort;
67-
let publicPath = defaultPublicPath;
68-
69-
// eslint-disable-next-line no-undefined
70-
const shouldParsePath = path !== null && path !== undefined && path !== '/';
71-
if (shouldParsePath) {
72-
const parsedQuery = querystring.parse(path);
73-
// all of these sock url params are optionally passed in through
74-
// resourceQuery, so we need to fall back to the default if
75-
// they are not provided
76-
sockHost = parsedQuery.sockHost || sockHost;
77-
sockPath = parsedQuery.sockPath || sockPath;
78-
sockPort = parsedQuery.sockPort || sockPort;
79-
publicPath = parsedQuery.publicPath || publicPath;
80-
}
5+
const urlParts = getUrlParts(resourceQuery);
816

827
return url.format({
83-
protocol,
84-
auth,
85-
hostname: sockHost,
86-
port: sockPort,
8+
protocol: urlParts.protocol,
9+
auth: urlParts.auth,
10+
hostname: urlParts.sockHost,
11+
port: urlParts.sockPort,
8712
// If sockPath is provided it'll be passed in via the resourceQuery as a
8813
// query param so it has to be parsed out of the querystring in order for the
8914
// client to open the socket to the correct location.
90-
pathname: sockPath,
15+
pathname: urlParts.sockPath,
9116
});
9217
}
9318

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import url from 'url';
2+
import querystring from 'querystring';
3+
import getCurrentScriptSource from './getCurrentScriptSource';
4+
5+
function getUrlParts(resourceQuery) {
6+
let urlParts;
7+
8+
if (typeof resourceQuery === 'string' && resourceQuery !== '') {
9+
// If this bundle is inlined, use the resource query to get the correct url.
10+
urlParts = url.parse(resourceQuery.substr(1));
11+
} else {
12+
// Else, get the url from the <script> this file was called with.
13+
const scriptHost = getCurrentScriptSource();
14+
15+
// it seems the reg exp below was intended to cut off the path of a script source,
16+
// so if you have my.host/long/path as the script source, it would become my.host.
17+
// however, it did not work, because if you had http://my.host/long/path it would
18+
// turn it into http:/. Cutting off the path is no longer needed, since we
19+
// simply do url.parse and pull the host from there.
20+
21+
// eslint-disable-next-line no-useless-escape
22+
// scriptHost = scriptHost.replace(/\/[^\/]+$/, '');
23+
urlParts = url.parse(scriptHost || '/', false, true);
24+
}
25+
26+
if (!urlParts.port || urlParts.port === '0') {
27+
urlParts.port = self.location.port;
28+
}
29+
30+
const { auth, query } = urlParts;
31+
let { hostname, protocol } = urlParts;
32+
33+
// check ipv4 and ipv6 `all hostname`
34+
// why do we need this check?
35+
// hostname n/a for file protocol (example, when using electron, ionic)
36+
// see: https://github.com/webpack/webpack-dev-server/pull/384
37+
const isAnyHostname =
38+
(hostname === '0.0.0.0' || hostname === '::') &&
39+
self.location.hostname &&
40+
// eslint-disable-next-line no-bitwise
41+
!!~self.location.protocol.indexOf('http');
42+
43+
if (isAnyHostname) {
44+
hostname = self.location.hostname;
45+
}
46+
47+
// `hostname` can be empty when the script path is relative. In that case, specifying
48+
// a protocol would result in an invalid URL.
49+
// When https is used in the app, secure websockets are always necessary
50+
// because the browser doesn't accept non-secure websockets.
51+
if (
52+
hostname &&
53+
(self.location.protocol === 'https:' || urlParts.hostname === '0.0.0.0')
54+
) {
55+
protocol = self.location.protocol;
56+
}
57+
58+
// default values of the sock url if they are not provided
59+
const defaultHost = hostname;
60+
const defaultSockPath = '/sockjs-node';
61+
const defaultPort = urlParts.port;
62+
const defaultPublicPath = '/';
63+
64+
let sockHost = defaultHost;
65+
let sockPath = defaultSockPath;
66+
let sockPort = defaultPort;
67+
let publicPath = defaultPublicPath;
68+
69+
// eslint-disable-next-line no-undefined
70+
if (query !== null && query !== undefined) {
71+
const parsedQuery = querystring.parse(query);
72+
// all of these sock url params are optionally passed in through
73+
// resourceQuery, so we need to fall back to the default if
74+
// they are not provided
75+
sockHost = parsedQuery.sockHost || sockHost;
76+
sockPath = parsedQuery.sockPath || sockPath;
77+
sockPort = parsedQuery.sockPort || sockPort;
78+
publicPath = parsedQuery.publicPath || publicPath;
79+
}
80+
81+
return {
82+
protocol,
83+
auth,
84+
defaultHost,
85+
defaultPort,
86+
sockHost,
87+
sockPath,
88+
sockPort,
89+
publicPath,
90+
};
91+
}
92+
93+
export default getUrlParts;

client-src/default/utils/updatePublicPath.js

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
1-
'use strict';
2-
31
/* global __webpack_public_path__ */
42

5-
const url = require('url');
6-
const getUrlParts = require('./getUrlParts');
3+
import url from 'url';
4+
import getUrlParts from './getUrlParts';
75

86
function updatePublicPath(resourceQuery) {
97
const urlParts = getUrlParts(resourceQuery);
@@ -26,4 +24,4 @@ function updatePublicPath(resourceQuery) {
2624
__webpack_public_path__ = __webpack_public_path__ || publicPath;
2725
}
2826

29-
module.exports = updatePublicPath;
27+
export default updatePublicPath;

lib/utils/addEntries.js

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,15 +30,30 @@ function addEntries(config, options, server) {
3030
/** @type {string} */
3131
const domain = createDomain(options, app);
3232
/** @type {string} */
33-
const sockHost = options.sockHost ? `&sockHost=${options.sockHost}` : '';
33+
const sockHost = options.sockHost
34+
? `&sockHost=${encodeURIComponent(options.sockHost)}`
35+
: '';
3436
/** @type {string} */
35-
const sockPath = options.sockPath ? `&sockPath=${options.sockPath}` : '';
37+
const sockPath = options.sockPath
38+
? `&sockPath=${encodeURIComponent(options.sockPath)}`
39+
: '';
3640
/** @type {string} */
37-
const sockPort = options.sockPort ? `&sockPort=${options.sockPort}` : '';
41+
const sockPort = options.sockPort
42+
? `&sockPort=${encodeURIComponent(options.sockPort)}`
43+
: '';
3844
/** @type {string} */
39-
const clientEntry = `${require.resolve(
40-
'../../client/'
41-
)}?${domain}${sockHost}${sockPath}${sockPort}`;
45+
const publicPath = options.publicPath
46+
? `&publicPath=${encodeURIComponent(options.publicPath)}`
47+
: '';
48+
49+
/** @type {string} */
50+
const queryString = `${sockHost}${sockPath}${sockPort}${publicPath}`;
51+
52+
/** @type {string} */
53+
const query = queryString === '' ? '' : `?${queryString.substr(1)}`;
54+
55+
/** @type {string} */
56+
const clientEntry = `${require.resolve('../../client/')}?${domain}${query}`;
4257

4358
/** @type {(string[] | string)} */
4459
let hotEntry;

test/cli/cli.test.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ describe('CLI', () => {
5656
const { stdout } = await testBin('--sockPath /mysockPath');
5757
expect(
5858
// the /mysockPath becomes %2FmysockPath from encodeURIComponent
59-
/http:\/\/localhost:[0-9]+?sockPath=%2FmysockPath/.test(stdout)
59+
/http:\/\/localhost:[0-9]+\?sockPath=%2FmysockPath/.test(stdout)
6060
).toEqual(true);
6161
});
6262

test/client/utils/getUrlParts.test.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,10 @@ describe('getUrlParts', () => {
4444
() => () => url
4545
);
4646

47-
// eslint-disable-next-line global-require
48-
const getUrlParts = require('../../../client-src/default/utils/getUrlParts');
47+
const {
48+
default: getUrlParts,
49+
// eslint-disable-next-line global-require
50+
} = require('../../../client-src/default/utils/getUrlParts');
4951

5052
test(`should return url parts when __resourceQuery is ${url}`, () => {
5153
expect(getUrlParts(`?${url}`)).toMatchSnapshot();

test/client/utils/updatePublicPath.test.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,10 @@ describe('updatePublicPath', () => {
4848
() => () => url
4949
);
5050

51-
// eslint-disable-next-line global-require
52-
const updatePublicPath = require('../../../client-src/default/utils/updatePublicPath');
51+
const {
52+
default: updatePublicPath,
53+
// eslint-disable-next-line global-require
54+
} = require('../../../client-src/default/utils/updatePublicPath');
5355

5456
test(`should set public path when __resourceQuery is ${url}`, () => {
5557
__webpack_public_path__ = '';

0 commit comments

Comments
 (0)