fix: use localhost for output and open

Author: alexander-akait

lib/Server.js

@@ -597,8 +597,9 @@ class Server {
     let networkUrlForTerminalIPv6;
 
     const parsedIP = ipaddr.parse(hostname);
+    const isUnspecified = parsedIP.range() === 'unspecified';
 
-    if (parsedIP.range() === 'unspecified') {
+    if (isUnspecified) {
       localhostForTerminal = prettyPrintUrl('localhost');
 
       const networkIPv4 = internalIp.v4.sync();
@@ -615,6 +616,10 @@ class Server {
         }
       }
     } else {
+      if (parsedIP.range() === 'loopback') {
+        localhostForTerminal = prettyPrintUrl('localhost');
+      }
+
       if (parsedIP.kind() === 'ipv6') {
         if (parsedIP.isIPv4MappedAddress()) {
           networkUrlForTerminalIPv4 = prettyPrintUrl(
@@ -630,7 +635,7 @@ class Server {
       }
     }
 
-    if (localhostForTerminal) {
+    if (isUnspecified) {
       this.logger.info('Project is running at:');
       this.logger.info(`Local: ${colors.info(useColor, localhostForTerminal)}`);
 
@@ -649,6 +654,11 @@ class Server {
       this.logger.info(`On Your Network: ${networkUrlsForTerminal.join(', ')}`);
     } else {
       const networkUrlsForTerminal = []
+        .concat(
+          localhostForTerminal
+            ? [`${colors.info(useColor, localhostForTerminal)}`]
+            : []
+        )
         .concat(
           networkUrlForTerminalIPv4
             ? [`${colors.info(useColor, networkUrlForTerminalIPv4)} (IPv4)`]

test/cli/__snapshots__/cli.test.js.snap

@@ -8,7 +8,7 @@ exports[`CLI --host :: (IPv6): stderr 1`] = `
 `;
 
 exports[`CLI --host ::1 (IPv6): stderr 1`] = `
-"<i> [webpack-dev-server] Project is running at http://[::1]:<port>/ (IPv6)
+"<i> [webpack-dev-server] Project is running at http://localhost:<port>/, http://[::1]:<port>/ (IPv6)
 <i> [webpack-dev-server] Content not from webpack is served from '<cwd>/public' directory"
 `;
 
@@ -30,7 +30,7 @@ exports[`CLI --host 0:0:0:0:0:FFFF:7F00:0001 (IPv6): stderr 1`] = `
 `;
 
 exports[`CLI --host 127.0.0.1 (IPv4): stderr 1`] = `
-"<i> [webpack-dev-server] Project is running at http://127.0.0.1:<port>/ (IPv4)
+"<i> [webpack-dev-server] Project is running at http://localhost:<port>/, http://127.0.0.1:<port>/ (IPv4)
 <i> [webpack-dev-server] Content not from webpack is served from '<cwd>/public' directory"
 `;
 
@@ -42,11 +42,11 @@ exports[`CLI --host and --port are unspecified: stderr 1`] = `
 `;
 
 exports[`CLI --host localhost --port 9999: stderr 1`] = `
-"<i> [webpack-dev-server] Project is running at http://127.0.0.1:<port>/ (IPv4)
+"<i> [webpack-dev-server] Project is running at http://localhost:<port>/, http://127.0.0.1:<port>/ (IPv4)
 <i> [webpack-dev-server] Content not from webpack is served from '<cwd>/public' directory"
 `;
 
 exports[`CLI --host localhost: stderr 1`] = `
-"<i> [webpack-dev-server] Project is running at http://127.0.0.1:<port>/ (IPv4)
+"<i> [webpack-dev-server] Project is running at http://localhost:<port>/, http://127.0.0.1:<port>/ (IPv4)
 <i> [webpack-dev-server] Content not from webpack is served from '<cwd>/public' directory"
 `;

test/server/open-option.test.js

@@ -15,7 +15,7 @@ open.mockImplementation(() => {
 });
 
 describe('open option', () => {
-  it.only('should work with unspecified host', (done) => {
+  it('should work with unspecified host', (done) => {
     const compiler = webpack(config);
     const server = new Server(compiler, {
       open: true,
@@ -27,7 +27,7 @@ describe('open option', () => {
       server.close(() => {
         expect(open.mock.calls[0]).toMatchInlineSnapshot(`
           Array [
-            "http://127.0.0.1:8117/",
+            "http://localhost:8117/",
             Object {
               "wait": false,
             },
@@ -54,7 +54,7 @@ describe('open option', () => {
       server.close(() => {
         expect(open.mock.calls[1]).toMatchInlineSnapshot(`
           Array [
-            "http://127.0.0.1:8117/index.html",
+            "http://localhost:8117/index.html",
             Object {
               "wait": false,
             },
@@ -80,7 +80,7 @@ describe('open option', () => {
       server.close(() => {
         expect(open.mock.calls[0]).toMatchInlineSnapshot(`
           Array [
-            "http://127.0.0.1:8117/",
+            "http://localhost:8117/",
             Object {
               "wait": false,
             },
@@ -107,7 +107,7 @@ describe('open option', () => {
       server.close(() => {
         expect(open.mock.calls[0]).toMatchInlineSnapshot(`
           Array [
-            "http://127.0.0.1:8117/",
+            "http://localhost:8117/",
             Object {
               "wait": false,
             },
@@ -134,7 +134,7 @@ describe('open option', () => {
       server.close(() => {
         expect(open.mock.calls[0]).toMatchInlineSnapshot(`
           Array [
-            "http://127.0.0.1:8117/",
+            "http://localhost:8117/",
             Object {
               "wait": false,
             },