From c7e188a9920f77ff71db12b9a18792b2f38648f7 Mon Sep 17 00:00:00 2001
From: thjungers <31347150+thjungers@users.noreply.github.com>
Date: Tue, 28 Mar 2023 19:34:22 +0200
Subject: [PATCH 1/2] Use custom document passed to handle

---
 src/main.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/main.js b/src/main.js
index 472d244..4cf8da9 100644
--- a/src/main.js
+++ b/src/main.js
@@ -101,7 +101,8 @@ function init(i18next, options={}){
     }
 
     function handle(selector, opts){
-        var elems = options.document.querySelectorAll(selector);
+        const document = opts?.document || options.document;
+        var elems = document.querySelectorAll(selector);
         for(let i = 0; i < elems.length; i++){
             let elem = elems[i];
             let childs = elem.querySelectorAll('[' + options.selectorAttr + ']');

From c54fd5a4f9e1235c7d030fd160c38593b156c61b Mon Sep 17 00:00:00 2001
From: thjungers <31347150+thjungers@users.noreply.github.com>
Date: Tue, 28 Mar 2023 19:40:38 +0200
Subject: [PATCH 2/2] Add example for custom document object

---
 README.md | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/README.md b/README.md
index 2efa20d..39b5b5c 100644
--- a/README.md
+++ b/README.md
@@ -121,6 +121,17 @@ localize("#btn1");
 localize("#btn1");
 ```
 
+### use a custom `document` object
+```js
+<template id="template">
+  <a id="btn1" href="#" data-i18n="myKey"></a>
+</template>
+const shadowRoot = document.body.attachShadow();
+const template = document.getElementById("template");
+shadowRoot.appendChild(template.content.cloneNode(true));
+localize("#btn1", {document: shadowRoot});
+```
+
 ## Motivation
 - Having an occasion to try some packages like rollup, babel or uglify.
 - Obtaining the same kind of functionnalities than with `jquery-i18next` in a project not using jquery.