Use logger from PluginContext (#37)

package.json

@@ -42,7 +42,7 @@
     "@types/update-notifier": "^4.1.0",
     "@typescript-eslint/eslint-plugin": "^2.23.0",
     "@typescript-eslint/parser": "^2.23.0",
-    "@zeplin/cli": "^1.0.4",
+    "@zeplin/cli": "git://github.com/zeplin/cli.git#plugin-logger",
     "@zeplin/eslint-config": "^2.2.0",
     "copyfiles": "^2.1.1",
     "eslint": "^6.4.0",

src/index.ts

@@ -10,6 +10,7 @@ import { loadStoriesFromURL, Story } from "./storybook/stories";
 import { startApp, checkResponse } from "./storybook/start-app";
 import { createStoryHyperlink, StoryHyperlinkParams, StoryHyperlinkOptions } from "./util/create-hyperlink";
 import { name, version } from "../package.json";
+import { getLogger, setLogger } from "./util/logger";
 
 const IFRAME_PATH = "iframe.html";
 
@@ -48,7 +49,7 @@ const checkStorybook = async (url: string, { errorMessage }: { errorMessage: str
             ${errorMessage}
         `);
     }
-    console.log(`Detected Storybook at ${url}`);
+    getLogger()?.info(`Detected Storybook at ${url}`);
 };
 
 const isPathsEqual = (path1: string, path2: string): boolean =>
@@ -96,8 +97,11 @@ export default class implements ConnectPlugin {
         this.targetUrl = targetUrl || url;
         this.useDocsPage = useDocsPage;
 
+        setLogger(pluginContext.logger);
+        const logger = getLogger();
+
         if (!fetchStories) {
-            console.log("Fetching stories from Storybook instance is disabled.");
+            logger?.info("Fetching stories from Storybook instance is disabled.");
             return;
         }
 
@@ -126,7 +130,7 @@ export default class implements ConnectPlugin {
         }
 
         if (this.storiesLoaded()) {
-            console.log(`Loaded ${this.stories.length} stories from Storybook.`);
+            logger?.info(`Loaded ${this.stories.length} stories from Storybook.`);
         }
     }
 

src/storybook/start-app.js

@@ -5,6 +5,8 @@ import https from 'https';
 import fetch from 'node-fetch';
 import path from 'path';
 
+import { getLogger } from '../util/logger';
+
 const POLL_INTERVAL = 1000,
 const TIMEOUT = 5 * 60 * 1000,
 const PROMPT_TIMEOUT = 20 * 1000,
@@ -21,7 +23,9 @@ export async function checkResponse(url) {
 }
 
 async function waitForResponse(child, url) {
-  console.log("Waiting Storybook to start…");
+  const logger = getLogger();
+
+  logger.info("Waiting Storybook to start…");
 
   const timeoutAt = Date.now() + TIMEOUT;
   let promptAt = Date.now() + PROMPT_TIMEOUT;
@@ -38,7 +42,7 @@ async function waitForResponse(child, url) {
       }
 
       if (Date.now() > promptAt) {
-        console.log(`No server responding at ${url}, trying again.`);
+        logger.warn(`No server responding at ${url}, trying again.`);
         promptAt = Date.now() + PROMPT_TIMEOUT;
       }
 

src/storybook/stories.js

@@ -6,6 +6,7 @@ import dedent from 'ts-dedent';
 import { extract } from './extract';
 
 import { addShimsToJSDOM } from './jsdom-shims';
+import { getLogger } from '../util/logger';
 
 const separator = '=========================';
 
@@ -52,10 +53,11 @@ export async function loadStoriesFromURL(url, { ignoreSSLErrors = false, failFas
   // If the app logged something to console.error, it's probably, but not definitely an issue.
   // See https://github.com/hichroma/chromatic/issues/757
   if (errors.length || warnings.length) {
-    console.log('The following problems were reported from your storybook:');
+    const logger = getLogger();
+    logger.info('The following problems were reported from your storybook:');
 
     if (errors.length) {
-      console.log(
+      logger.error(
         errors.reduce(
           (acc, i) => dedent`
               ${acc}
@@ -71,7 +73,7 @@ export async function loadStoriesFromURL(url, { ignoreSSLErrors = false, failFas
     }
 
     if (warnings.length) {
-      console.log(
+      logger.warn(
         warnings.reduce(
           (acc, i) => dedent`
               ${acc}
@@ -87,10 +89,10 @@ export async function loadStoriesFromURL(url, { ignoreSSLErrors = false, failFas
     }
 
     if (failFastOnErrors) {
-      console.log("Fast fail is enabled. Aborting…");
+      logger.debug("Fast fail is enabled. Aborting…");
       throw new Error("Storybook reported errors.");
     } else {
-      console.log(dedent`
+      logger.warn(dedent`
         This may lead to some stories not working right or getting detected by Zeplin CLI
         We suggest you fix the errors, but we will continue anyway..
         ${separator}

src/util/logger.ts

@@ -0,0 +1,11 @@
+// eslint-disable-next-line import/named
+import { Logger } from "@zeplin/cli";
+
+let loggerInstance: Logger;
+
+const getLogger = (): Logger | undefined => loggerInstance;
+const setLogger = (logger: Logger): void => {
+    loggerInstance = logger;
+};
+
+export { getLogger, setLogger };