Repository: styleguidist/react-styleguidist
Pull request #595 (2017-08-29 10:27:16)

#470 Improve terminal output on style guide server start
Implementation of #470 

If something wrong with this pull request or I need to update the documentation let me know.

codecov-io: # [Codecov](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=h1) Report
> Merging [#595](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=desc) into [master](https://codecov.io/gh/styleguidist/react-styleguidist/commit/ee4746d0390d2791f8bea08d4744638e5e1218a0?src=pr&el=desc) will **decrease** coverage by `0.13%`.
> The diff coverage is `90.32%`.

[![Impacted file tree graph](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595/graphs/tree.svg?token=Z1XExpSVLu&src=pr&height=150&width=650)](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=tree)

```diff
@@            Coverage Diff             @@
##           master     #595      +/-   ##
==========================================
- Coverage   96.04%   95.91%   -0.14%     
==========================================
  Files          98       99       +1     
  Lines        1316     1347      +31     
  Branches      270      276       +6     
==========================================
+ Hits         1264     1292      +28     
- Misses         50       53       +3     
  Partials        2        2
```


| [Impacted Files](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=tree) | Coverage Δ | |
|---|---|---|
| [scripts/utils/devServerUtils.js](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=tree#diff-c2NyaXB0cy91dGlscy9kZXZTZXJ2ZXJVdGlscy5qcw==) | `90.32% <90.32%> (ø)` | |

------

[Continue to review full report at Codecov](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=continue).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=footer). Last update [ee4746d...558f430](https://codecov.io/gh/styleguidist/react-styleguidist/pull/595?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).

sapegin: Thanks for the pull request!

Is it possible to reuse some code from react-dev-utils?
snmslavk: This code mostly is from react-dev-utils with some changes. I did it according to your link posted in #470 
sapegin: I mean *reuse* not *copypaste* :-)
snmslavk: Something like this ? :)
sapegin: Whoa, that’s much better! ;-)

Patch:
diff --git a/bin/styleguidist.js b/bin/styleguidist.js
index b8bd088b..e43a3b78 100755
--- a/bin/styleguidist.js
+++ b/bin/styleguidist.js
@@ -11,6 +11,7 @@ const setupLogger = require('../scripts/logger');
 const consts = require('../scripts/consts');
 const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const StyleguidistError = require('../scripts/utils/error');
+const devServerUtils = require('../scripts/utils/devServerUtils');
 
 const argv = minimist(process.argv.slice(2));
 const command = argv._[0];
@@ -107,14 +108,7 @@ function commandServer() {
 			console.error(err);
 		} else {
 			const isHttps = compiler.options.devServer && compiler.options.devServer.https;
-			logger.info(
-				'Style guide server started at:\n' +
-					(isHttps ? 'https' : 'http') +
-					'://' +
-					config.serverHost +
-					':' +
-					config.serverPort
-			);
+			devServerUtils.printInstructions(isHttps, config.serverHost, config.serverPort);
 		}
 	});
 
diff --git a/scripts/utils/devServerUtils.js b/scripts/utils/devServerUtils.js
new file mode 100644
index 00000000..1a9b6962
--- /dev/null
+++ b/scripts/utils/devServerUtils.js
@@ -0,0 +1,17 @@
+'use strict';
+
+const chalk = require('chalk');
+const logger = require('glogg')('rsg');
+const webpackDevServerUtils = require('react-dev-utils/WebpackDevServerUtils');
+
+function printInstructions(isHttps, host, port) {
+	const urls = webpackDevServerUtils.prepareUrls(isHttps ? 'https' : 'http', host, port);
+	logger.info(`You can now view style guide in the browser.`);
+
+	logger.info(`  ${chalk.bold('Local:')}            ${urls.localUrlForTerminal}`);
+	logger.info(`  ${chalk.bold('On your network:')}  ${urls.lanUrlForTerminal}`);
+}
+
+module.exports = {
+	printInstructions,
+};


Test patch:
diff --git a/scripts/utils/__tests__/devServerUtils.spec.js b/scripts/utils/__tests__/devServerUtils.spec.js
new file mode 100644
index 00000000..8d58948b
--- /dev/null
+++ b/scripts/utils/__tests__/devServerUtils.spec.js
@@ -0,0 +1,6 @@
+import devServerUtils from '../devServerUtils';
+
+it('Main method doesn’t throw error', () => {
+	const fn = () => devServerUtils.printInstructions();
+	expect(fn).not.toThrowError();
+});