From 69ef4892104f3cf1986e541a918be46da41949f6 Mon Sep 17 00:00:00 2001
From: John Hildenbiddle <jhildenbiddle@users.noreply.github.com>
Date: Tue, 29 Jan 2019 22:21:50 -0800
Subject: [PATCH] fix: task list rendering (Fix #749) (#757)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This PR restores the task list presentation removed in 4.8:

- Add “task-list-item” class to task list `<li>` elms
- Hide list bullets on unordered task lists `<li>` elms

It also provides several improvements on the pre-4.8 presentation:

- Add “task-list” class to task list `<ul>` elms
- Display list numbers on ordered task lists `<li>` elms
- Render accessible task list items by wrapping checkbox and text in `<label>` elm
- Allow task lists to be nested within standard ordered/unordered lists

Please makes sure these boxes are checked before submitting your PR, thank you!

* [x] Make sure you are merging your commits to `master` branch.
* [x] Add some descriptions and refer relative issues for you PR.
* [x] DO NOT include files inside `lib` directory.
---
 src/core/render/compiler.js   | 17 +++++++++++++++++
 src/themes/basic/_layout.styl |  3 +++
 2 files changed, 20 insertions(+)

diff --git a/src/core/render/compiler.js b/src/core/render/compiler.js
index b086b1476..91b954c02 100644
--- a/src/core/render/compiler.js
+++ b/src/core/render/compiler.js
@@ -302,6 +302,23 @@ export class Compiler {
 
       return `<img src="${url}"data-origin="${href}" alt="${text}"${attrs}>`
     }
+    origin.list = renderer.list = function (body, ordered, start) {
+      const isTaskList = /<li class="task-list-item">/.test(body.split('class="task-list"')[0])
+      const isStartReq = start && start > 1
+      const tag = ordered ? 'ol' : 'ul'
+      const tagAttrs = [
+        (isTaskList ? 'class="task-list"' : ''),
+        (isStartReq ? `start="${start}"` : '')
+      ].join(' ').trim()
+
+      return `<${tag} ${tagAttrs}>${body}</${tag}>`
+    }
+    origin.listitem = renderer.listitem = function (text) {
+      const isTaskItem = /^(<input.*type="checkbox"[^>]*>)/.test(text)
+      const html = isTaskItem ? `<li class="task-list-item"><label>${text}</label></li>` : `<li>${text}</li>`
+
+      return html
+    }
 
     renderer.origin = origin
 
diff --git a/src/themes/basic/_layout.styl b/src/themes/basic/_layout.styl
index f74d1ede8..4e00e33f0 100644
--- a/src/themes/basic/_layout.styl
+++ b/src/themes/basic/_layout.styl
@@ -383,6 +383,9 @@ body.sticky
   border-radius 2px
   padding 1rem
 
+.markdown-section ul.task-list > li
+  list-style-type none
+
 body.close
   .sidebar
     transform translateX(- $sidebar-width)