Allow configs to be functions

.editorconfig

@@ -0,0 +1,11 @@
+# http://EditorConfig.org
+
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

docs/configuration.md

@@ -1,6 +1,6 @@
 # Configuration
 
-You can configure the `window.$docsify`.
+You can configure Docsify by defining `window.$docsify` as an object:
 
 ```html
 <script>
@@ -12,6 +12,24 @@ You can configure the `window.$docsify`.
 </script>
 ```
 
+The config can also be defined as a function, in which case the first arg is the Docsify `vm` instance. The function should return a config object. This can be useful for referencing `vm` in places like the markdown configuration:
+
+```html
+<script>
+  window.$docsify = function(vm) {
+    return {
+      markdown: {
+        renderer: {
+          code(code, lang) {
+            // ... use `vm` ...
+          },
+        },
+      },
+    };
+  };
+</script>
+```
+
 ## el
 
 - Type: `String`

src/core/config.js

@@ -2,7 +2,7 @@ import { merge, hyphenate, isPrimitive, hasOwn } from './util/core';
 
 const currentScript = document.currentScript;
 
-export default function() {
+export default function(vm) {
   const config = merge(
     {
       el: '#app',
@@ -35,7 +35,9 @@ export default function() {
       relativePath: false,
       topMargin: 0,
     },
-    window.$docsify
+    typeof window.$docsify === 'function'
+      ? window.$docsify(vm)
+      : window.$docsify
   );
 
   const script =

src/core/index.js

@@ -11,7 +11,7 @@ import initGlobalAPI from './global-api';
  * @returns {Number|void} If the page is already laoded returns the result of the setTimeout callback,
  *  otherwise it only attaches the callback to the DOMContentLoaded event
  */
-function ready(callback) {
+export function documentReady(callback) {
   const state = document.readyState;
 
   if (state === 'complete' || state === 'interactive') {
@@ -21,7 +21,7 @@ function ready(callback) {
   document.addEventListener('DOMContentLoaded', callback);
 }
 
-function Docsify() {
+export function Docsify() {
   this._init();
 }
 
@@ -42,4 +42,4 @@ initGlobalAPI();
  * Run Docsify
  */
 // eslint-disable-next-line no-unused-vars
-ready(_ => new Docsify());
+documentReady(_ => new Docsify());

src/core/init/index.js

@@ -9,7 +9,7 @@ import { initLifecycle, callHook } from './lifecycle';
 export function initMixin(proto) {
   proto._init = function() {
     const vm = this;
-    vm.config = config();
+    vm.config = config(vm);
 
     initLifecycle(vm); // Init hooks
     initPlugin(vm); // Install plugins

test/_helper.js

@@ -19,6 +19,21 @@ function ready(callback) {
   document.addEventListener('DOMContentLoaded', callback);
 }
 
+module.exports.initJSDOM = initJSDOM;
+
+/** @param {string} markup - The HTML document to initialize JSDOM with. */
+function initJSDOM(markup, options = {}) {
+  const dom = new JSDOM(markup, options);
+
+  global.window = dom.window;
+  global.document = dom.window.document;
+  global.navigator = dom.window.navigator;
+  global.location = dom.window.location;
+  global.XMLHttpRequest = dom.window.XMLHttpRequest;
+
+  return dom;
+}
+
 module.exports.init = function(
   fixture = 'default',
   config = {},
@@ -39,15 +54,9 @@ module.exports.init = function(
 
   const rootPath = path.join(__dirname, 'fixtures', fixture);
 
-  const dom = new JSDOM(markup);
+  const dom = initJSDOM(markup);
   dom.reconfigure({ url: 'file:///' + rootPath });
 
-  global.window = dom.window;
-  global.document = dom.window.document;
-  global.navigator = dom.window.navigator;
-  global.location = dom.window.location;
-  global.XMLHttpRequest = dom.window.XMLHttpRequest;
-
   // Mimic src/core/index.js but for Node.js
   function Docsify() {
     this._init();

test/unit/docsify.test.js

@@ -0,0 +1,101 @@
+/* eslint-disable no-global-assign */
+require = require('esm')(module /* , options */);
+
+const path = require('path');
+const { expect } = require('chai');
+const { initJSDOM } = require('../_helper');
+
+const docsifySite = path.join(__dirname, '..', '..', 'docs');
+
+const markup = /* html */ `<!DOCTYPE html>
+  <html>
+    <head></head>
+    <body>
+      <div id="app"></div>
+    </body>
+  </html>
+`;
+
+describe('Docsify public API', () => {
+  it('is available', async () => {
+    const DOM = initJSDOM(markup);
+    DOM.reconfigure({ url: 'file:///' + docsifySite });
+
+    const { documentReady } = require('../../src/core/index');
+    await new Promise(resolve => documentReady(resolve));
+
+    expect(typeof window.Docsify).to.equal('object');
+    expect(typeof window.Docsify.util).to.equal('object');
+    expect(typeof window.Docsify.dom).to.equal('object');
+    expect(typeof window.Docsify.get).to.equal('function');
+    expect(typeof window.Docsify.slugify).to.equal('function');
+    expect(typeof window.Docsify.version).to.equal('string');
+
+    expect(window.DocsifyCompiler).to.be.an.instanceof(Function);
+    expect(window.marked).to.be.an.instanceof(Function);
+    expect(typeof window.Prism).to.equal('object');
+  });
+});
+
+describe('Docsify config function', function() {
+  it('allows $docsify to be a function', async function() {
+    const DOM = initJSDOM(markup);
+    DOM.reconfigure({ url: 'file:///' + docsifySite });
+
+    window.configFunctionCalled = false;
+
+    window.$docsify = function(vm) {
+      // Check public API (that which is available at this point)
+      expect(vm).to.be.an.instanceof(Object);
+      expect(vm.constructor.name).to.equal('Docsify');
+      expect(vm.$fetch).to.be.an.instanceof(Function);
+      expect(vm.$resetEvents).to.be.an.instanceof(Function);
+      expect(vm.route).to.be.an.instanceof(Object);
+
+      window.configFunctionCalled = true;
+
+      return {};
+    };
+
+    const { documentReady, Docsify } = require('../../src/core/index');
+    await new Promise(resolve => documentReady(resolve));
+
+    new Docsify(); // eslint-disable-line
+
+    expect(window.configFunctionCalled).to.equal(true);
+  });
+
+  it('provides the hooks and vm API to plugins', async function() {
+    const DOM = initJSDOM(markup);
+    DOM.reconfigure({ url: 'file:///' + docsifySite });
+
+    window.pluginFunctionCalled = false;
+
+    window.$docsify = function(vm) {
+      const vm1 = vm;
+      return {
+        plugins: [
+          function(hook, vm2) {
+            expect(vm1).to.equal(vm2);
+
+            expect(hook.init).to.be.an.instanceof(Function);
+            expect(hook.beforeEach).to.be.an.instanceof(Function);
+            expect(hook.afterEach).to.be.an.instanceof(Function);
+            expect(hook.doneEach).to.be.an.instanceof(Function);
+            expect(hook.mounted).to.be.an.instanceof(Function);
+            expect(hook.ready).to.be.an.instanceof(Function);
+
+            window.pluginFunctionCalled = true;
+          },
+        ],
+      };
+    };
+
+    const { documentReady, Docsify } = require('../../src/core/index');
+    await new Promise(resolve => documentReady(resolve));
+
+    new Docsify(); // eslint-disable-line
+
+    expect(window.pluginFunctionCalled).to.equal(true);
+  });
+});