Merge pull request #986 from GitbookIO/fix/heading_ids

Normalize ID for headings

lib/utils/page.js

@@ -6,6 +6,7 @@ var cheerio = require('cheerio');
 var domSerializer = require('dom-serializer');
 var request = require('request');
 var crc = require('crc');
+var slug = require('github-slugid');
 
 var links = require('./links');
 var imgUtils = require('./images');
@@ -14,18 +15,18 @@ var batch = require('./batch');
 
 var parsableExtensions = require('gitbook-parsers').extensions;
 
+// Map of images that have been converted
+var imgConversionCache = {};
+
 // Render a cheerio dom as html
-var renderDom = function($, dom, options) {
+function renderDom($, dom, options) {
     if (!dom && $._root && $._root.children) {
         dom = $._root.children;
     }
 
     options = options|| dom.options || $._options;
     return domSerializer(dom, options);
-};
-
-// Map of images that have been converted
-var imgConversionCache = {};
+}
 
 function replaceText($, el, search, replace, text_only ) {
     return $(el).each(function(){
@@ -114,6 +115,13 @@ function normalizeHtml(src, options) {
         });
     }
 
+    // Generate ID for headings
+    $('h1,h2,h3,h4,h5,h6').each(function() {
+        if ($(this).attr('id')) return;
+
+        $(this).attr('id', slug($(this).text()));
+    });
+
     // Find images to normalize
     $('img').each(function() {
         var origin;

package.json

@@ -11,7 +11,7 @@
         "resolve": "0.6.3",
         "fs-extra": "0.16.5",
         "fstream-ignore": "1.0.2",
-        "gitbook-parsers": "0.8.5",
+        "gitbook-parsers": "0.8.7",
         "gitbook-plugin-highlight": "1.0.3",
         "gitbook-plugin-sharing": "1.0.1",
         "gitbook-plugin-search": "1.0.2",
@@ -39,7 +39,8 @@
         "juice": "1.5.0",
         "jsonschema": "1.0.2",
         "json-schema-defaults": "0.1.1",
-        "merge-defaults": "0.2.1"
+        "merge-defaults": "0.2.1",
+        "github-slugid": "1.0.0"
     },
     "devDependencies": {
         "eslint": "1.5.0",

test/books/headings/README.md

@@ -0,0 +1,3 @@
+# Hello World
+
+## Hello {#hello-custom}

test/codehighlighting.js

@@ -1,63 +1,63 @@
-var path = require("path");
-var fs = require("fs");
+var path = require('path');
+var fs = require('fs');
 
-var Plugin = require("../lib/plugin");
-var PLUGINS_ROOT = path.resolve(__dirname, "plugins");
+var Plugin = require('../lib/plugin');
+var PLUGINS_ROOT = path.resolve(__dirname, 'plugins');
 
-describe("Code Highlighting", function () {
+describe('Code Highlighting', function () {
     var book, PAGE;
 
     before(function() {
-        return books.generate("highlight", "website", {
+        return books.generate('highlight', 'website', {
             prepare: function(_book) {
                 book = _book;
 
-                var plugin = new Plugin(book, "replace_highlight");
-                plugin.load("./replace_highlight", PLUGINS_ROOT);
+                var plugin = new Plugin(book, 'replace_highlight');
+                plugin.load('./replace_highlight', PLUGINS_ROOT);
 
                 book.plugins.load(plugin);
             }
         })
         .then(function() {
             PAGE = fs.readFileSync(
-                path.join(book.options.output, "index.html"),
-                { encoding: "utf-8" }
+                path.join(book.options.output, 'index.html'),
+                { encoding: 'utf-8' }
             );
         });
     });
 
-    it("should correctly replace highlighting", function() {
+    it('should correctly replace highlighting', function() {
         PAGE.should.be.html({
-            "code": {
+            'code': {
                 index: 0,
-                text: "code_test 1\n_code"
+                text: 'code_test 1\n_code'
             }
         });
     });
 
-    it("should correctly replace highlighting with language", function() {
+    it('should correctly replace highlighting with language', function() {
         PAGE.should.be.html({
-            "code": {
+            'code': {
                 index: 1,
-                text: "lang_test 2\n_lang"
+                text: 'lang_test 2\n_lang'
             }
         });
     });
 
-    it("should correctly replace highlighting for inline code", function() {
+    it('should correctly replace highlighting for inline code', function() {
         PAGE.should.be.html({
-            "code": {
+            'code': {
                 index: 2,
-                text: "code_test 3_code"
+                text: 'code_test 3_code'
             }
         });
     });
 
-    it("should correctly replace highlighting for inline code with html tags", function() {
+    it('should correctly replace highlighting for inline code with html tags', function() {
         PAGE.should.be.html({
-            "code": {
+            'code': {
                 index: 3,
-                text: "code_<test>_code"
+                text: 'code_<test>_code'
             }
         });
     });

test/heading.js

@@ -0,0 +1,37 @@
+var path = require('path');
+var fs = require('fs');
+
+describe('Headings', function () {
+    var book, PAGE;
+
+    before(function() {
+        return books.generate('headings', 'website')
+        .then(function(_book) {
+            book = _book;
+
+            PAGE = fs.readFileSync(
+                path.join(book.options.output, 'index.html'),
+                { encoding: 'utf-8' }
+            );
+        });
+    });
+
+    describe('IDs', function() {
+        it('should correctly generate an ID', function() {
+            PAGE.should.be.html({
+                'h1#hello-world': {
+                    count: 1
+                }
+            });
+        });
+
+        it('should correctly accept custom ID', function() {
+            PAGE.should.be.html({
+                'h2#hello-custom': {
+                    count: 1
+                }
+            });
+        });
+    });
+});
+