Use native JS clipboard interface

.github/workflows/integration.yml

@@ -20,7 +20,6 @@ jobs:
     - name: Install dependencies
       run: |
         python -m pip install --upgrade pip
-        git submodule update --init
         pip install -e .[code_style]
     - name: Run pre-commit
       run: |
@@ -62,7 +61,6 @@ jobs:
     - name: Install dependencies
       run: |
         python -m pip install --upgrade pip
-        git submodule update --init
         pip install -e .[rtd]
 
     - name: Build docs

.github/workflows/publish.yml

@@ -23,7 +23,6 @@ jobs:
       - name: Build package
         run: |
           pip install build
-          git submodule update --init
           python -m build
       - name: Publish
         uses: pypa/gh-action-pypi-publish@v1.5.1

README.md

@@ -53,4 +53,4 @@ After a release - following the [EBP release instructions](https://github.com/ex
 
 ## Acknowledgements
 
-Many thanks to the excellent [clipboard.js library](https://clipboardjs.com/) for the lightweight javascript code that powers the copy button!
+Many thanks to the excellent [clipboard.js library](https://clipboardjs.com/) for the lightweight javascript code that used to power the copy button!

docs/index.md

@@ -16,9 +16,7 @@
 ```
 
 Sphinx-copybutton does one thing: add a little "copy" button to the right
-of your code blocks. That's it! It is a lightweight wrapper around the
-excellent (and also lightweight) Javascript library
-[ClipboardJS](https://clipboardjs.com/).
+of your code blocks. That's it!
 
 **Here's an example**
 

readthedocs.yml

@@ -7,6 +7,3 @@ python:
       path: .
       extra_requirements:
         - rtd
-
-submodules:
-  include: all

setup.py

@@ -1,23 +1,7 @@
-import os
 from pathlib import Path
 
 from setuptools import setup, find_packages
 
-if os.path.isdir("clipboard.js") and not os.path.islink(
-    "sphinx_copybutton/_static/clipboard.min.js"
-):
-    raise SystemExit("Error: Support for symbolic links is required")
-
-if os.path.isdir("clipboard.js") and not os.path.isfile(
-    "clipboard.js/dist/clipboard.min.js"
-):
-    raise SystemExit(
-        """Error: clipboard.js submodule not available, run
-
-        git submodule update --init
-        """
-    )
-
 with open("./README.md") as ff:
     readme_text = ff.read()
 
@@ -45,7 +29,6 @@
             "_static/copybutton.js_t",
             "_static/copy-button.svg",
             "_static/check-solid.svg",
-            "_static/clipboard.min.js",
         ]
     },
     classifiers=[

sphinx_copybutton/__init__.py

@@ -90,7 +90,6 @@ def setup(app):
 
     # Add relevant code to headers
     app.add_css_file("copybutton.css")
-    app.add_js_file("clipboard.min.js")
     app.add_js_file("copybutton.js")
     return {
         "version": __version__,

sphinx_copybutton/_static/copybutton.js_t

@@ -93,15 +93,6 @@ const runWhenDOMLoaded = cb => {
 
 const codeCellId = index => `codecell${index}`
 
-// Clears selected text since ClipboardJS will select the text when copying
-const clearSelection = () => {
-  if (window.getSelection) {
-    window.getSelection().removeAllRanges()
-  } else if (document.selection) {
-    document.selection.empty()
-  }
-}
-
 // Changes tooltip text for a moment, then changes it back
 // We want the timeout of our `success` class to be a bit shorter than the
 // tooltip and icon change, so that we can hide the icon before changing back.
@@ -124,13 +115,6 @@ const temporarilyChangeIcon = (el) => {
 }
 
 const addCopyButtonToCodeCells = () => {
-  // If ClipboardJS hasn't loaded, wait a bit and try again. This
-  // happens because we load ClipboardJS asynchronously.
-  if (window.ClipboardJS === undefined) {
-    setTimeout(addCopyButtonToCodeCells, 250)
-    return
-  }
-
   // Add copybuttons to all of our code cells
   const COPYBUTTON_SELECTOR = '{{ copybutton_selector }}';
   const codeCells = document.querySelectorAll(COPYBUTTON_SELECTOR)
@@ -157,19 +141,23 @@ var copyTargetText = (trigger) => {
   return formatCopyText(text, {{ "{!r}".format(copybutton_prompt_text) }}, {{ copybutton_prompt_is_regexp | lower }}, {{ copybutton_only_copy_prompt_lines | lower }}, {{ copybutton_remove_prompts | lower }}, {{ copybutton_copy_empty_lines | lower }}, {{ "{!r}".format(copybutton_line_continuation_character) }}, {{ "{!r}".format(copybutton_here_doc_delimiter) }})
 }
 
-  // Initialize with a callback so we can modify the text before copy
-  const clipboard = new ClipboardJS('.copybtn', {text: copyTargetText})
-
-  // Update UI with error/success messages
-  clipboard.on('success', event => {
-    clearSelection()
-    temporarilyChangeTooltip(event.trigger, messages[locale]['copy'], messages[locale]['copy_success'])
-    temporarilyChangeIcon(event.trigger)
-  })
-
-  clipboard.on('error', event => {
-    temporarilyChangeTooltip(event.trigger, messages[locale]['copy'], messages[locale]['copy_failure'])
-  })
+  document.querySelectorAll(".copybtn").forEach((element) => {
+    element.addEventListener("click", (e) => {
+      navigator.clipboard
+        .writeText(copyTargetText(element))
+        .then(
+          () => {
+            // Update UI with error/success messages
+            e.preventDefault();
+            temporarilyChangeTooltip(element, messages[locale]['copy'], messages[locale]['copy_success'])
+            temporarilyChangeIcon(element)
+          },
+          () => {
+            temporarilyChangeTooltip(element, messages[locale]['copy'], messages[locale]['copy_failure'])
+          },
+        );
+    });
+  });
 }
 
 runWhenDOMLoaded(addCopyButtonToCodeCells)