anticensority/runet-censorship-bypass
1
1
Fork 0
mirror of https://github.com/anticensority/runet-censorship-bypass.git synced 2025-10-02 18:06:47 +03:00
Code Issues Packages Projects Releases Wiki Activity

Tidy up the html to bypass shadow dom restrictions for form association

Browse Source
This commit is contained in:
ilyaigpetrov 2025-09-20 16:11:02 +05:00
parent aaf9544b61
commit 06813f6c34
2 changed files with 19 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/pages/options/index.html
View File

@ -187,10 +187,10 @@
<div> <div>
<span id="attributes" hidden> <span id="attributes" hidden>
<slot name="id">ID</slot> <slot name="id">ID</slot>
<slot name="value"></slot> <slot name="value">VALUE</slot>
<slot name="for">FOR</slot> <slot name="for">FOR</slot>
</span> </span>
<input type="radio" name="pacScript" form="pacChooserForm" data-attrs="id value"> <slot name="input">INPUT</slot>
<label data-attrs="for"> <label data-attrs="for">
<slot name="label">LABEL</slot> <slot name="label">LABEL</slot>
</label> </label>
@ -205,6 +205,7 @@
<span slot="id">antizapret</span> <span slot="id">antizapret</span>
<span slot="value">antizapret</span> <span slot="value">antizapret</span>
<span slot="for">antizapret</span> <span slot="for">antizapret</span>
<input slot="input" attrs-line='type="radio" name="pacScript" form="pacChooserForm"' data-attrs="id value">
</pac-record> </pac-record>
</li> </li>
<li> <li>

27
src/pages/options/index.mjs
View File

@ -6,13 +6,13 @@ customElements.define('pac-record',
// static observedAttributes = ['data-checked']; // static observedAttributes = ['data-checked'];
constructor() { constructor() {
super(); super();
this.internals = this.attachInternals();
const shadow = this.attachShadow({ mode: 'open' }); const shadow = this.attachShadow({ mode: 'open' });
// const shadow = this.internals.shadowRoot; // const shadow = this.internals.shadowRoot;
console.log('Constructor'); console.log('Constructor');
const fragment = pacRecordTemplate.content.cloneNode(true); const fragment = pacRecordTemplate.content.cloneNode(true);
shadow.appendChild(fragment); shadow.appendChild(fragment);
//const templateAttrs = shadow.querySelectorAll('#attributes > slot[name]'); this.internals = this.attachInternals();
const dataAttrs = shadow.querySelectorAll('*[data-attrs]'); const dataAttrs = shadow.querySelectorAll('*[data-attrs]');
dataAttrs.forEach( dataAttrs.forEach(
(da) => { (da) => {
@ -21,23 +21,29 @@ customElements.define('pac-record',
console.log(shadow.querySelector(`#attributes > slot[name=${attr}]`)); console.log(shadow.querySelector(`#attributes > slot[name=${attr}]`));
da.setAttribute( da.setAttribute(
attr, attr,
shadow.querySelector(`#attributes > slot[name=${attr}]`).assignedNodes()?.[0].textContent, shadow.querySelector(`#attributes > slot[name=${attr}]`).assignedNodes()?.[0]?.textContent,
); );
}, },
); );
} }
); );
//this.internals.setFormValue('');
//this.internals.setFormValue('pacScript');
//const templateAttrs = shadow.querySelectorAll('#attributes > slot[name]');
const namedInputs = shadow.querySelectorAll('input[name]'); const namedInputs = shadow.querySelectorAll('input[name]');
console.log('NAMED INPUTS:', namedInputs);
namedInputs.forEach((ni) => { namedInputs.forEach((ni) => {
//this.internals.setFormValue(ni.name); //this.internals.setFormValue(ni.name);
ni.addEventListener('click', ni.addEventListener('input',
(event) => { (event) => {
const t = event.target; const t = event.target;
const entries = new FormData(); const entries = new FormData();
//entries.set(ni.getAttribute('name'), ni.getAttribute('value')); //entries.set(ni.getAttribute('name'), ni.getAttribute('value'));
entries.set('pacScript', 'antizapret'); entries.append('pacScript', t.value);
this.internals.setFormValue(t.checked ? t.value : null); this.internals.setFormValue(entries);
ni.toggleAttribute('checked'); //this.value = t.value;
//this.internals.setFormValue(t.value);
//ni.toggleAttribute('checked');
//this.internals.setFormValue(ni.value); //this.internals.setFormValue(ni.value);
//this.toggleAttribute('checked'); //this.toggleAttribute('checked');
//this.toggleAttribute('data-checked'); //this.toggleAttribute('data-checked');
@ -45,9 +51,9 @@ customElements.define('pac-record',
console.log('EVENT TARGET:', event.target); console.log('EVENT TARGET:', event.target);
console.log('THIS', this); console.log('THIS', this);
console.log(this.internals); console.log(this.internals);
console.log('EEEE', entries); console.log('EEEE', Array.from(...entries));
console.log(`FFFF:${ni.name}=${ni.value}`); console.log(`FFFF:${ni.name}=${ni.value}`);
return true; ni.click();
}) })
}); });
@ -60,13 +66,12 @@ customElements.define('pac-record',
input.id = input.value = label.htmlFor = this.dataset.id;*/ input.id = input.value = label.htmlFor = this.dataset.id;*/
} }
/*
attributeChangedCallback(name, oldValue, newValue) { attributeChangedCallback(name, oldValue, newValue) {
console.log('attributeChangedCallback:', oldValue, '->', newValue); console.log('attributeChangedCallback:', oldValue, '->', newValue);
const entries = new FormData(); const entries = new FormData();
entries.set('pacScript', 'antizapret'); entries.set('pacScript', 'antizapret');
this.internals.setFormValue(entries); this.internals.setFormValue(entries);
}*/ }
} }
); );
/* /*