feat: implement GFM support

- use my own strikethrough implementation at this moment
- update turndown-plugin-gfm if mixmark-io/turndown-plugin-gfm#12 will be fixed at upstream

README.md

@@ -13,13 +13,22 @@ Right click and select:
 - when part of the page is selected: **Copy Selection as Markdown**
 - when user context-clicks in the page: **Copy Title and URL as Markdown**
 
-## Setting
+## Settings
 
-You can configure **Append quote (<code>&gt;</code>) to selection** and **Include link to source web page in the beginning of copied text**, and **Markdown Styles**.
+You can configure followings:
+
+- Append quote (<code>&gt;</code>) to selection
+- Include link to source web page in the beginning of copied text
+- Enable experimental MathJax support
+- Enable <a href="https://github.github.com/gfm/">GitHub Flavored Markdown</a> (strikethrough, tables, and taskListItems) support
+- Markdown Styles (see below for detail)
+
+Set your preference by:
 
 1. Click the menu button ![](images/menu.svg) and choose ![](images/extensionGeneric-16.svg) **Add-ons**. The Add-ons Manager tab will open
 2. In the Add-ons Manager tab, select the **Extensions** panel
 3. Find **Copy Selection as Markdown** and click **Preferences**
+4. Hit **Save** button to apply changes (no restart required)
 
 ### Available Markdown Styles
 
@@ -112,35 +121,40 @@ You can configure **Append quote (<code>&gt;</code>) to selection** and **Includ
 #### Link style
 
 - Inlined (default)
-    ```
-    [Inlined](https://example.com)
-    ```
+  ```
+  [Inlined](https://example.com)
+  ```
 - Referenced
-    ```
-    [Referenced][1]<br/>
-    [1]: https://example.com
-    ```
+  ```
+  [Referenced][1]<br/>
+  [1]: https://example.com
+  ```
 
 #### Link reference style
 
 - Reference (default)
-    ```
-    [Reference][1]
-    
-    [1]: https://example.com
-    ```
+
+  ```
+  [Reference][1]
+
+  [1]: https://example.com
+  ```
+
 - Collapsed
-    ```
-    [Reference with collapsed style][]
-    
-    [Reference with collapsed style]: https://example.com
-    ```
+
+  ```
+  [Reference with collapsed style][]
+
+  [Reference with collapsed style]: https://example.com
+  ```
+
 - Shortcut
-    ```
-    [Reference with shortcut style]
-    
-    [reference with shortcut style]: https://example.com
-    ```
+
+  ```
+  [Reference with shortcut style]
+
+  [reference with shortcut style]: https://example.com
+  ```
 
 ## Contributing
 

package.json

@@ -38,7 +38,8 @@
   },
   "dependencies": {
     "clipboard-copy": "^2.0.1",
-    "turndown": "4.0.2"
+    "turndown": "4.0.2",
+    "turndown-plugin-gfm": "^1.0.2"
   },
   "prettier": {
     "printWidth": 120

src/copy.js

@@ -16,6 +16,7 @@ async function main() {
       typeof options.linkReferenceStyle === "undefined" ? "full" : options.linkReferenceStyle;
     options.debug = typeof options.debug === "undefined" ? false : options.debug;
     options.mathjax = typeof options.mathjax === "undefined" ? false : options.mathjax;
+    options.gfm = typeof options.gfm === "undefined" ? false : options.gfm;
 
     let text = `[${document.title}](${document.URL})`;
     let selection = getSelectionAsMarkdown(options);

src/lib/turndown-plugin-gfm-strikethrough.js

@@ -0,0 +1,8 @@
+export default function strikethrough(turndownService) {
+  turndownService.addRule("strikethrough", {
+    filter: ["del", "s", "strike"],
+    replacement: function(content) {
+      return "~~" + content + "~~";
+    }
+  });
+}

src/lib/util.js

@@ -1,5 +1,7 @@
 import TurndownService from "turndown";
 import turndownPluginMathJax from "./turndown-plugin-mathjax";
+import turndownPluginGfmStrikethrough from "./turndown-plugin-gfm-strikethrough";
+import { tables, taskListItems } from "turndown-plugin-gfm";
 import * as copy from "clipboard-copy";
 
 const url = require("url");
@@ -11,6 +13,12 @@ const getSelectionAsMarkdown = options => {
     turndownService.use(turndownPluginMathJax);
   }
 
+  if (options.gfm) {
+    turndownService.use(turndownPluginGfmStrikethrough);
+    turndownService.use(tables);
+    turndownService.use(taskListItems);
+  }
+
   let html = "";
   const sel = document.getSelection();
 

src/options.js

@@ -22,6 +22,7 @@ document.addEventListener("DOMContentLoaded", () => {
         typeof result.linkReferenceStyle === "undefined" ? "full" : result.linkReferenceStyle;
       document.querySelector("#debug").checked = typeof result.debug === "undefined" ? false : result.debug;
       document.querySelector("#mathjax").checked = typeof result.mathjax === "undefined" ? false : result.mathjax;
+      document.querySelector("#gfm").checked = typeof result.gfm === "undefined" ? false : result.gfm;
     },
     error => console.log(`Error: ${error}`)
   );
@@ -41,6 +42,7 @@ document.querySelector("form").addEventListener("submit", e => {
     linkStyle: document.querySelector("form").linkStyle.value,
     linkReferenceStyle: document.querySelector("form").linkReferenceStyle.value,
     debug: document.querySelector("#debug").checked,
-    mathjax: document.querySelector("#mathjax").checked
+    mathjax: document.querySelector("#mathjax").checked,
+    gfm: document.querySelector("#gfm").checked
   });
 });

src/settings.html

@@ -29,6 +29,8 @@ <h2>General</h2>
         <label for="link">Include link to source web page in the beginning of copied text</label><br>
         <input type="checkbox" id="mathjax">
         <label for="mathjax">Enable experimental MathJax support (<a href="https://github.com/0x6b/copy-selection-as-markdown/issues/new">report issue</a> if you find anything strange, with <strong>debug</strong> enabled</label><br>
+        <input type="checkbox" id="gfm">
+        <label for="gfm">Enable <a href="https://github.github.com/gfm/">GitHub Flavored Markdown</a> (strikethrough, tables, and taskListItems) support</label><br>
         <input type="checkbox" id="debug">
         <label for="debug">Log debug message in the console</label>
     </div>

yarn.lock

@@ -8466,6 +8466,11 @@ tunnel-agent@^0.6.0:
   dependencies:
     safe-buffer "^5.0.1"
 
+turndown-plugin-gfm@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/turndown-plugin-gfm/-/turndown-plugin-gfm-1.0.2.tgz#6f8678a361f35220b2bdf5619e6049add75bf1c7"
+  integrity sha512-vwz9tfvF7XN/jE0dGoBei3FXWuvll78ohzCZQuOb+ZjWrs3a0XhQVomJEb2Qh4VHTPNRO4GPZh0V7VRbiWwkRg==
+
 turndown@4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/turndown/-/turndown-4.0.2.tgz#c3ddb8ba32a3665723599be2f4e7860adb6042ae"