ugrás a tartalomhoz

Javascript (egy topic-ban)

mind1 valami név · 2023. Ápr. 1. (Szo), 22.22
Talán jobb lesz, ha nem nyitok új témát minden apró hülyeségnek.
Legalábbis én könnyebben visszatalálok egy topic-ba, mintha sok régi közt kellene turkálni (pl. CSS-nél jártam így nemrég - szerencsére azt pont megtaláltam)
 
1

Sok mező kitöltése JSON-ból

mind1 valami név · 2023. Ápr. 1. (Szo), 22.36
Mi van, ha ki kell tölteni egy jókora űrlapot, amihez az adatokat JSON formátumban kapom egy API-n keresztül?

<div class="container">
<span>címke 1:</span><span id="elso"></span>
<span>címke 2:</span><span id="masodik"></span>
...
<span>címke n:</span><span id="sokadik"></span>

function fetch_callback(x){
  const elso=document.getElementById("elso");  
  const masodik=document.getElementById("masodik"); 
... 
  const sokadik=document.getElementById("sokadik");

  elso.innerText=x.elso;
  masodik.innerText=x.masodik;
...
  sokadik.innerText=x.sokadik;
Ez így elfogadható? Akkor is, ha sokszor tíz mezőt kell átvenni és kitölteni?
A kérdés elsősorban arra irányul, hogy normális-e minden mezőhöz külön konstanst gyártani, majd arra hivatkozva művelni valamit vagy ezt másképp szokás? A const ötlete onnan jött, hogy amit most csinálok, az félig-meddig SPA kategória, így mindig ottmarad valami szemét a container mezőiben, amit mielőtt elindítom a fetch-t, kitakarítok. Emiatt két helyen kell hivatkozni az id-kre, így egyszerűbb egy helyen hívni a document.getElementById-t, nem kell külön a takarításnál és külön a feltöltésnél. (elvben nincs jelentősége, csak ronda, ha egy pillanatra felbukkan valami oda nem illő infó)
2

Iterálás

Endyl · 2023. Ápr. 2. (V), 00.21
Első ötlet valami ilyesmi:
function fetchCallback(x) {
    for (const [id, value] of Object.entries(x)) {
        const element = document.getElementById(id);
        element.innerText = value;
    }
}
Persze csak ha biztos vagy benne, hogy nincs olyan kulcs x-ben, ami valami problémás dolgot felülírna. Ha van, akkor érdemes szűrni az engedélyezett id-kre.

Egy fokkal pedánsabban:
function fetchCallback(x) {
    for (const [id, value] of Object.entries(x)) {
        setInnerTextById(id, value);
    }
}
function setInnerTextById(id, text) {
    const element = document.getElementById(id);
    element.innerText = text;
}
3

Köszi, ezt legalább most

mind1 valami név · 2023. Ápr. 2. (V), 01.43
Köszi, ezt legalább most értem is, hogy mi miért. :)
Lassan már értek belőle annyit, hogy valami alapdolgot magamtól is össze tudok rakni.
Lassan... több, mint tíz évig tologattam magam előtt. :(

(utálok két nyelvet tanulni párhuzamosan - már megint összefolyt a js és a python -> pythonban kellett volna egy olyan, mint a js Object.elements, de arra az osztályra, amire használni akartam, pont nincs :) )
4

Hát, én is sokáig tologattam

Endyl · 2023. Ápr. 2. (V), 02.16
Hát, én is sokáig tologattam magam előtt a JS-t, mire leesett a tantusz, és nem csak másolgattam, módosítgattam remélhetőleg működő kódokat. Meg utána a pythont is :D Szóval respekt, hogy nem adod fel :) Főleg egyszerre.
5

:) Ha lenne mivel

mind1 valami név · 2023. Ápr. 2. (V), 07.34
:)
Ha lenne mivel szórakoztatni magam, rég feladtam volna.
A vicc, hogy anno a pythonba úgy vágtam bele, hogy java programot akartam írni, de előbb tesztadatokat akartam generálni hozzá, ahhoz meg kellett volna valami szkriptnyelv, amivel egyszerűen lehet adatbázisba írni.
Utóbb rájöttem, hogy a javat az életbe nem tanulom meg a kilométeres nevekkel (akkor még a swing lett volna "a" GUI, ha jól emlékszem), a python meg sok esetben gyorsabb is volt, azóta próbálkoztam vele. De csak a tesztelgetésig jutottam. Most szedtem össze magam annyira, hogy ezt a primitív, semmire se jó izét készre(?) csináljam. Semmi authentikáció, semmi OOP, semmi adatbázis, de van user felület, van API (REST-nek nem nevezhető :) ), a JS is csinál "valamit" és ha nagyon kell, ezt már tudom úgy alakítani, hogy számomra akár hasznos is lehet.
Amennyiben ezekrt a dolgokat nem felejtem el pár órán, napon belül, akkor fél év múlva akár munkát is vállalhatnék. :D
6

Hát, sajnos találkoztam már

Endyl · 2023. Ápr. 2. (V), 13.28
Hát, sajnos találkoztam már olyan "szakmabelivel", akinek ennél kevesebb hasznosítható tudása és tapasztalata volt :( Szóval hajrá :)
7

De nekem van önkritikám. Bár

mind1 valami név · 2023. Ápr. 2. (V), 14.22
De nekem van önkritikám. Bár jelen helyzetben nem biztos, hogy ez a helyes út. :(
8

Vért izzadva...

mind1 valami név · 2023. Ápr. 4. (K), 15.06
https://github.com/haa-zee/pyndex/tree/devel/app/bin

Ezt sikerült úgy fél év alatt (valójában pár nap, rengeteg szünettel :) ) összetákolni.
A "master" branch még kissé hiányos állapotú volt, mikor ma újra nekiestem, de nem volt kedvem még a git doksit is túrni, hogy hogyan lesz ebből úgy master, hogy megmaradjon a devel branch is.

Mint rájöttem, semmire sem volt jó azon kívül, hogy egy-két dolgot megtanultam. Python Flask-ben nagyjából megcsináltam azt, amit pl. nginx vagy apache magától is tud (autoindex, fancy index stb.), annyi plusz van benne, hogy a kirakott könyvtár lista elemein jobb klikkre feljönnek az op.rendszer stat() függvénye által visszaadott értékek, emberi formára konvertálva.

Ami fura, hogy a github AI szerint is problémás a paraméterként érkező path/fájlnév kezelés, mert illetéktelenül hozzá lehet férni fájlokhoz. Nem tudom, a flask pontosan mit csinál, de nekem linuxon nem sikerült kitörni a bedrótozott document_root-ból. (A /név/../../../../etc/passwd nem működik, a .. eltűnik a path-ból, mire a program megkapja. :)

Úgyhogy már neki tudok esni annak, amit eredetileg akartam: plugint írni firefox alá. :)
ui: vajon kiknek volt annyira érdekes ez a projekt, hogy 15 klón készült tegnap óta, ebből 7 egyedi? Mert egy vagy két klónt valami automata készít, azt tudom. De ennyit... ??
Update: van egy tippem... létezik egy régi, pyndex projekt. A pontos célját nem ismerem, de szerintem páran azt hitték, hogy ahhoz tartozik. :)
54

github klónok :D

mind1 valami név · 2023. Ápr. 23. (V), 19.27
Úgy tűnik, valami automata van rákattanva a githubra: nemrég felraktam egy üres repot, benne egy readme-vel, hogy "itt majd lesz valami". Másnapra azon is hét egyedi, összességében 15 klón jelent meg. :)
9

Firefox addon - de androidon

mind1 valami név · 2023. Ápr. 5. (Sze), 09.02
Egyelőre nem találtam konkrét választ arra, hogy a firefox/mozilla(?) hogyan dönti el, mi az ami kompatibilis egy androidos firefox-szal és mi az, ami nem.
Nincs valakinek ötlete?

Látok millió primitív kiegészítőt ha a mozilla oldalát böngészem, amik a leírásuk alapján nem igényelhetnek speciális jogosultságokat, funkciókat (pl. olyanok, amikkel gyakorlatilag csak átszínezik az oldalakat, betűtípust változtatnak stb.)
Ehhez képest androidra csak néhány kiegészítőt enged feltenni ezek közül. Feltételezem, hogy nem arról van szó, hogy szerkesztőségi emberek választják ki az erre érdemes addonokat, kell, hogy legyen valami szempont, ami alapján eldől, mi van megengedve. Na ezt eddig nem találtam meg. :(
10

Elvileg

Endyl · 2023. Ápr. 5. (Sze), 09.36
Azért elég otthonosan mozgok a témában, de erre vonatkozó infót most nehezen találtam, az is csak egy megjegyzés formájában ezen az oldalon: különbségek desktop és android kiegészítők között

Az oldal maga elavult, viszont azt írják, hogy bizony csak szerkesztőségi tagok engedélyeznek mobilra néhány fontosnak tartott kiegészítőt.
11

Pedig reméltem, hogy csak én

mind1 valami név · 2023. Ápr. 5. (Sze), 10.04
Pedig reméltem, hogy csak én vagyok figyelmetlen. :(

Köszi.
12

Manifest v3...

mind1 valami név · 2023. Ápr. 5. (Sze), 14.26
És most nézem, hogy a manifest_version:2-re a chrome már pofázik, hogy deprecated. A v3 meg ugye az a kategória, amitől kezdve a legtöbb hasznos kiegészítő mehet a kukába, mert nehogymár valaki reklámokat blokkoljon...
13

Ezért is használunk Firefoxot

Endyl · 2023. Ápr. 5. (Sze), 16.17
Ezért is használunk Firefoxot :)
14

Valóban :D Csak az a pletyka

mind1 valami név · 2023. Ápr. 5. (Sze), 16.47
Valóban :D
Csak az a pletyka járja, hogy abból is kiveszik a v2-t.
16

Igen, de elvileg megtartják a

Endyl · 2023. Ápr. 5. (Sze), 19.23
Igen, de elvileg megtartják a normális reklámblokkoláshoz szükséges apikat :)
17

Azért én egy cseppet tartok

mind1 valami név · 2023. Ápr. 5. (Sze), 21.06
Azért én egy cseppet tartok tőle.
Az egész v3-ra átállás megint hozza majd a szokásos játékot: rengeteg kiegészítő ismét eltűnik hónapokra, évekre, végleg.
Anno a noscript egy nagyon jól sikerült biztonsági eszköz volt. Aztán megújították, azóta egyre butább, egyre rosszabb.
18

Most nézem, hogy androidra

mind1 valami név · 2023. Ápr. 6. (Cs), 08.28
Most nézem, hogy androidra kb. esélytelen addont gyártani a dolgok jelenlegi állása szerint, mert telepíteni csak a mozilla oldaláról lehet, .xpi-ből csak desktopra megy.
Szóval nem ok nélkül aggaszt az androidos firefox...
19

Találtam egy másik oldalt a

mind1 valami név · 2023. Ápr. 6. (Cs), 19.20
Találtam egy másik oldalt a linkedről indulva, amit már régebben is kerestem, de vagy még nem létezett vagy átsiklottam felette: https://extensionworkshop.com/documentation/develop/developing-extensions-for-firefox-for-android/

Amolyan középkori kínzóeszköz fílingje van :D
15

Függvény paraméterrel mi történik?

mind1 valami név · 2023. Ápr. 5. (Sze), 18.23
--- bocs,storno, vak vagyok, mint párszor már említettem ---
20

firefox extension - manifest.json

mind1 valami név · 2023. Ápr. 8. (Szo), 19.10
{
    "manifest_version": 2,
    "name":   "My2ndext",
    "version":  "0.0.1",
    "description":  "Trying background - description",
    "background": 
        {
		"scripts":  ["background.js"],
		"type":	"module"
        }
}
Ezzel mi a baj? Megint vaksi vagyok vagy valami kimaradt a doksiból? Nem látom, hogy a type-ra lenne megkötés a verziót illetően, de ha benne van, akkor a firefox sír, hogy "Reading manifest: Warning processing background.type: An unexpected property was found in the WebExtension manifest."
A google szokás szerint nem segít, mert minden fasságot felhoz "találatként", de egyiknek sincs köze ahhoz, amit kértem, hogy mutasson egy működő példát rá :)
21

FF 112

Endyl · 2023. Ápr. 8. (Szo), 19.58
Az MDN (manifest.json/background) itt is hasznos. A kompatibilitási tábla szerint csak Firefox 112-től támogatott a background.type.
22

Köszi. Azt elkönyveltem

mind1 valami név · 2023. Ápr. 8. (Szo), 20.17
Köszi. Azt elkönyveltem 48-nak :D Nem véletlenül mondom, hogy nem látok. Ennyire... :(
Átfutottam a táblázaton 48, 48, 48 ... OK, akkor ez nem gond. Az, hogy az utolsó sor kicsit más, már nem tűnt fel.
ui: nem hülyéskedek, tényleg ennyire rossz a szemem, nem puszta figyelmetlenség. Most is háromszor kellett végigmenni rajta, mire észrevettem, miről beszélsz.
23

És akkor ennyi...

mind1 valami név · 2023. Ápr. 8. (Szo), 22.52
-
24

contextMenu - csak a kiválasztott elemeknél

mind1 valami név · 2023. Ápr. 14. (P), 22.35
Az vajon kulturáltnak nevezhető megoldás, ha az extension úgy épül fel, hogy...
Background scriptben
- gyártok egy menü elemet (browser.menus.create), amely láthatatlan.
- berakok listenert az üzenetekre (browser.runtime.onMessage.addListener), ami az üzenetben kaphat többféle parancsot, köztük egy showmenu/hidemenu-t. Ha e kettőből valamelyik jön, akkor a browser.menus.update("id", {visible:true/false}) segítségével állítja be, hogy szükség van-e rá.

(eddig gondolom, nem nagyon van más módszer)

A content script meg úgy épül fel, hogy azokra az elemekre, amelyekkel dolgozni akarok, felhúzok egy eventlistenert valahogy így:
document.querySelectorAll(".comment").forEach({ 
     (e) => e.addEventListener("contextmenu", () => browser.runtime.sendMessage("showmenu"), true) });
Végül a window is kap egy listenert:
window.addEventListener("contextmenu", () => { browser.runtime.sendMessage("hidemenu"); }); 
Kipróbáltam, működik, csak azt nem tudom, ez így elfogadható vagy van ennél "szabványosabb" mód is, ha csak bizonyos helyeken akarom megjeleníteni a menüt?
Csak feltételezem: minden contextmenu eseményt kezelni kell, hogy ne maradjon kirakva a menü akkor is, amikor nincs rá szükség.
25

manifest - action - (tárgytalan)

mind1 valami név · 2023. Ápr. 17. (H), 01.28
Azért a history kedvéért ezt itthagyom.
Szóval ha nem indítom újra a böngészőt, akkor hiába törlöm az extensiont és töltöm be újra, nem változik a korábbi helye az ikonnak. Ha teljesen bezárom a browsert, akkor már hajlandó átvándorolni oda, ahová akarom. (és igen, a menupanelt és a navbart félreértettem, a Firefox Multi-Account Containers nem tudom, mit művel, hogy be tudja illeszteni magát az URL mögé, de a jelek szerint nem a manifest-ben adja meg)

--------------------------------------------

(lehet, hogy félreértettem a "navbar" és a "menupanel" jelentését, de tökmindegy, mert bármelyiket használom a doksiban megadott lehetőségek közül, minden ugyanúgy viselkedik)

Ha manifest v3-t használok és megpróbálom rávenni a böngészőt, hogy az extensionöm ikonját ne a többi ikon közé tegye, hanem az URL végébe és beállítok egy ilyet:

"action": {
"browser_style": true,
"default_icon": {
"48": "icons/icon48.svg"
},
"default_title": "xxxx",
"default_area": "navbar"
}

akkor miért ragaszkodik hozzá, hogy a menupanel-nek megfelelő helyre tegye ki, feltéve, hogy az "extensions" alatt jobb klikk után rákattintok a Pin to toolbar-ra? (firefox-ból v111 van nálam, ezt meg 109 óta kell tudnia)

A chatgpt itt is írja a hülyeségeit töményen, de érdemben nem tudott hozzászólni. :)
ui: nincs igazán szükségem rá, csak ki akartam próbálni, hogy mit művel ez a paraméter és úgy tűnik, nagyon nem csinál semmit.

Lehet, hogy kivételesen nem bennem van a hiba: kipróbáltam egy idegen extensiont ami szintén használná ezt a paramétert, de ott sincs változás. Bármit írok a default_area után, ugyanúgy jelenik meg.
26

page_action

Endyl · 2023. Ápr. 17. (H), 10.38
A page_action kerül közvetlenül az URL barba.
27

Köszi, közben rájöttem, hogy

mind1 valami név · 2023. Ápr. 17. (H), 12.37
Köszi, közben rájöttem, hogy "a számítógép az utasításaid és nem a kívánságaid szerint működik" :D
Az viszont tény, hogy amíg nem indítom újra a browsert, addig tojik a default_area értékére.
28

Ez is ott van a

Endyl · 2023. Ápr. 17. (H), 13.01
Ez is ott van a doksiban:
Firefox remembers the default_area setting for an extension, even if that extension is uninstalled and subsequently reinstalled. To force the browser to acknowledge a new value for default_area, the id of the extension must be changed.

An extension can't change the location of the button after it has been installed, but the user may be able to move the button using the browser's built-in UI customization mechanism.
Gondolom amíg nem indítod újra a böngészőt, addig tárolja a fejlesztő módban betöltött kiegészítők id-jét ilyen célra. Egyrészt hasznos, másrészt jó lenne, ha lehetne egyszerűbben is törölni.
29

Igen, rájöttem én is, de

mind1 valami név · 2023. Ápr. 17. (H), 13.09
Igen, rájöttem én is, de attól még na...
Az ilyenek mindig felhúznak. :(
Egyébként megoldás lenne, amit több helyen javasoltak: web-ext használata (az a browsert is újraindítja állítólag, ha az extension változott), de valamit még ott is tovább kéne bogarászni, mert az npm install web-ext nem volt elég. De ott még nem tartok, hogy ezt alaposabban megnézzem.
30

Költői kérdés - extension popup html/css debug hogyan?

mind1 valami név · 2023. Ápr. 17. (H), 13.09
Humoros a firefox is. A problémás CSS-t/HTML-t nem nagyon lehet debuggolni, mert a popup-on nyomott jobbklikk menüben nincs Inspect, valamint ha máshová kattintok (pl. a development tools ablakára), azonnal becsukódik, a development tools meg egy üres oldalt mutogat a továbbiakban.
Például a H1 taget nem igazítja középre, ha a browser_tyle: True-ra van állítva.

Na mindegy, ez csak olyan anyázás helyettesítő, majd előtúrom, hogy mit javasolnak rá. (valahol láttam pár napja, csak akkor még nem volt aktuális)
31

Van rá "gomb" :)

Endyl · 2023. Ápr. 17. (H), 13.19
A kiegészítő devtooljában az eszköz fülek (vizsgáló, konzol, stb.) sorában jobb szélen van egy hárompöttyös menü. Abban ki kell választani a "Felugrók automatikus elrejtése ki" opciót, és akkor fókusz nélkül is nyitva maradnak. Ilyenkor (tehát amikor van extra kiegészítő "ablak" nyitva) ebben a sorban megjelenik egy extra ikon (a fényképező ikon mellett), amiben kiválasztahtod, hogy a vizsgáló, stb. melyik "ablakra" vonatkozzon. (Alapértelmezetten a vizsgáló a "background page"-re vontakozik.)
32

Mondom, hogy költői. :D Erre

mind1 valami név · 2023. Ápr. 17. (H), 13.24
Mondom, hogy költői. :D
Erre még emlékeztem (hogy van), meg arra is, hogy amit elsőre találtam, az nemlétező menüpontra hivatkozott. :)
Aztán valahol az mdn mélyén volt egy howto debug... kezdetű lista.
Ennyi maradt meg. A többit azalatt kerestem meg, amíg te gépeltél. :P

ui: sajnos ez van még mindig és permanensnek mondható: vagy átsiklok felette, lásd újraindítás elmaradásának következménye az ikonra, vagy csak háromszor kell feltúrnom a google-t mire megtalálom amit keresek. :) Az már rég nem megy, hogy leülök, megtanulom, használom. :(
33

web-ext - syntax error??

mind1 valami név · 2023. Ápr. 17. (H), 19.04
update: Kösz google ismét a sok "releváns" találatot! :(((
A web-ext nem volt idézőjelek közt, így hozott mindent, csak azt nem, ami tényleg erről szólt.
19.x nodejs kellene, az ubuntu 22.04 meg még 12.x.x-nél tart.

-------------------------------------------------


Na ezzel viszont tényleg nem tudok mit kezdeni.
sudo -i
apt install npm
...
npm install --global web-ext
npm audit
Látszólag rendben felmegy.
Aztán...
web-ext --help

És jön egy szép hosszú hibaüzenet$ web-ext
file:///usr/local/lib/node_modules/web-ext/bin/web-ext.js:13
await webExt.main(absolutePackageDir);
^^^^^

SyntaxError: Unexpected reserved word
at Loader.moduleStrategy (internal/modules/esm/translators.js:133:18)
at async link (internal/modules/esm/module_job.js:42:21)

Most ezzel mi a ...-t csináljak?
Ubuntu 22.04 van rajta, de semmi bugot, specifikus problémát nem találtam a google-n.

Telepítési leírás innen: https://extensionworkshop.com/documentation/develop/getting-started-with-web-ext/
Az npm hozta magával a nodejs-t.
34

Extension - kommunikáció a felek közt - hogyan?

mind1 valami név · 2023. Ápr. 18. (K), 16.24
Most eljutottam odáig, hogy ha ötvenszer olvasom el a talált, erről szóló írásokat, akkor sem értem, nem látom át az egészet.
Hogy működik ez az egész belülről?

Vannak scriptek, némelyikhez html/css is, úgymint:
content, background, popup ami lehet action/page_action. (ez utóbbi kettő azt hiszem, egyre megy a jelenleg tárgyalandó nézetből.

A background fut a saját környezetében, kommunikálni a browser.tabs.sendMessage, browser.action.onMessage.addListener segítségével tud(?)

A content scriptek gyakorlatilag beépülnek az oldalba, amihez illeszkedik a matches-ben megadott minta. Ez a browser.runtime.sendMessage segítségével küld üzenetet a backgroundnak és a browser.runtime.onMessage.addListener fogadja az ide küldött üzenetet.

A popup egy speciális content script, ami a saját html oldalához tartozik. De... hogy tudnak neki üzenni akár a background, akár a content scriptek? És ő hogy tud üzenni ennek a kettőnek? Jó, a backgroundnak mehet a runtime.sendMessage. De a contenttel mit lehet kezdeni?
És hogy lehet a popup-nek üzenetet küldeni - ha egyáltalán lehet?

Mindez most jött elő abból kifolyólag, hogy ha a popup beállításokban módosítok valamit, azt szeretném, ha az érintett scriptek is megkapnák, amihez jelen elképzeléseim szerint az lenne optimális, ha egyszerűen küldenék feléjük egy üzenetet.

Mondjuk a popup felé talán nem szükséges üzenetet küldeni, mert amint a hozzá tartozó lap megjelenik, a többi nem működik, amint mellé kattintok, záródik, tehát annak minimális az esélye, hogy egy content v. background script módosít valamit, amiről itt is tudni kellene.

Közben nézelődök a neten, találtam olyat, hogy window.addListener('Storage') és ott le lehet kérni, mely kulcs módosult, aztán ha olyan, ami az adott scriptet érinti, akkor update-elem a módosított adatokkal az oldalt újra.


ui: ha valaki érti amit írok és valahol marhaságot írtam, akkor kérem, javítsatok ki! Elsődlegesen magamnak írom, ide csak azért, mert fennáll a veszélye, hogy hülyeségeket képzelek dolgokról. :)
35

runtime

Endyl · 2023. Ápr. 18. (K), 16.40
Csak a contentScripteknek vannak speckó, csökkentett jogosultságai (meg a userScripteknek, de azzal még keveset bütyköltem). Minden más olyan, mint a backgroundScript. Tehát contentScriptnek a tabs.sendMessage() hívásával küldhetsz üzenetet, minden másnak meg a runtime.sendMessage() hívással (esetleg runtime.connect(), vagy ha contentScripthez akarsz csatlakozni, akkor tabs.connect(), de ez talán még messzebbre vezet :D ). Aztán ha olyan üzenetet kap az egyik listener, amivel nem neki kell törődnie, akkor false-t/undefined-ot kell visszaadnia.
36

Egyre cifrább :)Magyarán az

mind1 valami név · 2023. Ápr. 18. (K), 17.42
Egyre cifrább :)
Magyarán az onMessage.addListener-re broadcast jelleggel mennek ki az üzenetek és meg kell jelölni, hogy a backgroundnak vagy a popupnak szól? Ez kicsit zavarosnak tűnt a doksikban és példaprogramokban.

De van más gond is: a nyomorult content script nem látja az extension storage-t, ergo azon keresztül üzenni sem tudok neki. :(

Update: vagy mégis. Úgy tűnik, az eredetileg felfedezett window.addEventListener("storage",...) valami másra való, mint a browser.storage.onChanged.addListener().
Utóbbira ugrik a content script is, előbbire a background sem.
39

Igen

Endyl · 2023. Ápr. 19. (Sze), 09.24
Igen, sajnos saját "címzési" mechanizmust kell kitalálni a nem triviális esetekben.
37

async -> sync - ezzel megint nem tudok mit kezdeni.

mind1 valami név · 2023. Ápr. 18. (K), 20.13
function getLocalData() {
  let result;

  // Call browser.storage.local.get() with a callback function that sets the result variable
  browser.storage.local.get(function(data) {
    result = data;
  });

  // Wait until the result variable is set
  while (result === undefined) {
    continue;
  }

  // Return the result
  return result;
}
Ezt a chatgpt adta. Tényleg csak ilyen módon lehet bevárni egy async függvény eredményét? Mert ugye ha a saját függvényem async, akkor amit visszaad, az is csak egy Promise objektum, amit szintén be kell várni, amit nem async függvényben nem lehet...
40

callback vagy async/promise

Endyl · 2023. Ápr. 19. (Sze), 09.38
Én azt a kódot nem használnám :)
function processLocalData(result) {
	console.log('Result', result);
}

// vagy
chrome.storage.local.get(processLocalData);

// vagy
browser.storage.local.get().then(processLocalData).catch(error => {
	console.log('Error', error);
});

// vagy
async function akarmi() {
	try {
		let result = await browser.storage.local.get();
		processLocalData(result);
	}
	catch (error) {
		console.log('Error', error);
	}
}
42

Oka volt, hogy megjelöltem a

mind1 valami név · 2023. Ápr. 19. (Sze), 10.57
Oka volt, hogy megjelöltem a forrást. ;)
Állítólag a fizetős bem ennyire sötét, de arra nincs keret és ez önmagában elég riasztó. :)

Amit írtál, az köszi, de eddig is tiszta volt. Nekem ott az a bajom, hogy egy ponton úgy kellene működnie az egésznek, hogy azonnal rendelkezésre áll a visszakapott érték. Így meg a .then() majd valamikor visszatér, de addig a program fut tovább.
Kb. az egyetlen opció, hogy az async hívás (.get()) a kód utolsó sora, a folytatást meg a callback intézi.
De ez sem jó igazán, mert így meg a script végetér, függőben hagyott részekkel.
A konkrét esetben nem gond, de nem tudom, később ez hol okozhat gondokat. Még azon méláztam, hogy a callback esetleg lehet async és akkor abban mehet az await is.
(Ezt egyetlen nyelvben sem tudom megérteni, hogy miközben a valóságban mindig multithreadinget találtam a háttérben, miért kell az await-et az async függvények belsejére korlátozni - de ez csak egy költői sóhaj ;) )
43

De nincs azonnal :(

Endyl · 2023. Ápr. 19. (Sze), 11.18
Sajnos mivel a legtöbb esetben nincs azonnal eredmény, nem is érdemes erre alapozva szervezni a kódot. Nem tudom, hogy hol jelentene ez gondot. Talán módosított weboldal eseménykezelőiben lehet problémás/macerás, de általában megoldható.
44

Pl. amikor azzal indítok,

mind1 valami név · 2023. Ápr. 19. (Sze), 11.55
Pl. amikor azzal indítok, hogy a local storage-ből felszedem a kezdeti paramétereket, majd ezek alapján dolgozom és alapvetően nem akarok async kódot írni.
Normálisan (pseudokód) ez valahogy így megnne:

read ini file
parse -> dictionary
...
if dictionary['a-param']{...}
if dictionary['b-param']{...}

stb.

Itt a read (storage.local.get) után nem eshetek neki a paramétereknek, valahogy be kell várnom, míg azok rendelkezésre állnak. Megoldható, csak gusztustalan számomra. (pythonban már neki sem esnék, ha meglátom, hogy async def ;) )
45

Én kezdetektől fogva örültem

Endyl · 2023. Ápr. 19. (Sze), 11.59
Én kezdetektől fogva örültem az async/await-nek. Alig kell már callbackekkel bohóckodni. Ez is simán menne egy async függvénybe.
47

Úgy értem, nem akarok olyat

mind1 valami név · 2023. Ápr. 19. (Sze), 13.53
Úgy értem, nem akarok olyat látni pl., hogy betöltődik az oldal, majd átalakul, ahogy beérkezik a local storage-ből az összes beállítás (csak példa, de pl. adblock-tól láttam ilyet lassúbb gépen.)
38

Még mindig firefox extension - oldal méretének változtatása

mind1 valami név · 2023. Ápr. 18. (K), 22.30
Na ez is egy izgalmas dolog: mi van, ha egy oldal fontméretét szeretném permanens módon átállítani? Elsőre az ugrik be, hogy document.body.style.fontSize="nnpx";
Aztán megnézem és kiderül, hogy általában jónak látszik, de van pár kivétel.
Ott a getComputedStyle() -> végigmegyek egy kinyitott lap elemein, megnézem, hol van eltérés a default fontsize-tól. Hát elég sok helyen, viszont konkrétan az elemeken nincs ilyen beállítás, valamennyi .style.fontSize=="".
És itt el is akadtam. Nagyjából a Ctrl - +, Ctrl - - gombok működését kellene szimulálni valahogy, de eddig nem találtam használható megoldást rá.
41

Vizsgáló > számított css

Endyl · 2023. Ápr. 19. (Sze), 09.49
Vizsgálóban meg tudod nézni a számított css fülön, hogy honnan jön a font-size érték, ami használatban van. Az element.style csak a style attribútumban megadott szabályokat mutatja. Inline vagy külső stylesheet szabályaiból jövőket nem.

CSS állításra ott van még a tabs.insertCSS(), tabs.removeCSS (vagy ugyanezek scripting alatt, ha manifest V3).
46

Amit megnéztem, arra azt

mind1 valami név · 2023. Ápr. 19. (Sze), 12.03
Amit megnéztem, arra azt írta, hogy "inherited from blockquote" - ugyanis a body-hoz tartozó font méretet lekérdezve, majd megnövelve és a body-ra beállítva, az oldal szinte tökéletesnek tűnt.
Csak megnyitottam egy lapot, ahol volt egy dőltbetűs idézet és akkor tűnt fel, hogy a dőltbetű nem növekszik. :)

Ezt követően másztam végig az egész dom fán és megállapítottam, hogy sehol egy egyedi beállítás, mégis teli van eltérő méretű (getComputedStyle) fontokkal, amiknél nem találtam programból az eltérő méret forrását. Akkor néztem rá erre és állapítottam meg, hogy ez simán a default beállítások következménye, nincs rajta sehol külső CSS-ből állított méret.

Az ötlet onnan jött, hogy többen említették, az oldal túl apróbetűs, nem igazán igazodik jól a nagyfelbontású, kijelzőkhöz, míg más oldalak megteszik. Emiatt a böngésző/desktop rendszer nagyító funkcióját nem használhatják, az oldalra kellene külön egy nagyító. :)
(félre ne érts, nem akarom, hogy más oldja meg helyettem, pusztán hangosan gondolkodom, hogy egyáltalán létezik-e erre épeszű megoldás vagy tényleg fel kell túrni minden eltérő méretű elem méretének forrását és azt átírni?)
48

Nem fut le a content script, amíg... (+ reakcióidő)

mind1 valami név · 2023. Ápr. 19. (Sze), 20.47
Amíg meg nem nyitom az ikonjára kattintva az extensiont. Illetve most megjelent az extensions ikonjára kattintva a sajátom alatt egy kis menü, ahol engedélyezni lehetett, hogy minden alkalommal lefusson vagy csak azt követően, hogy az ikonjára kattintottam.

Ez vajon egy új feature vagy valami olyanba futottam bele, ami eddig is volt, csak nem vettem észre?

És van vele még egy gond: amit itt korábban emlegettem... betölti az eredeti oldalt, majd némi késleltetéssel kezdi átrajzolni. Nem a megjelenítés előtt fut le a content.js. :(
(Update: lehet, hogy erre megoldás a manifest.json-ben elhelyezett "run_at": "document_end" - ezt még ki kell próbálni)

Az egész ennyi:

manifest.json:
{
   "manifest_version": 3,
   "name": "teszt",
   "version": "0.0.1",
   "content-scripts": [{
      "js": ["content.js"],
      "matches": ["*://localhost/*"]
   }]
}
content.js:
document.body.style.fontSize="15px";
A firefoxot ma reggel upgrade-eltem, most 112-es van. Remélem, ezt a viccet csak a temporary extensionöknél játssza el :)
52

Firefox 112 - vicces kis szoftver

mind1 valami név · 2023. Ápr. 21. (P), 08.13
Azt hittem, csak Dr. Alzheimer kopogtat ismét, mikor nem akart az általam írt extension inicializáló része lefutni, míg rá nem kattintottam az ikonjára.
Most szántam rá magam, hogy előszedjek egy régebbi firefoxot - igaz, ez még 102-es (Debian), de ezen szó nélkül lefut, nem kell külön engedélyezni.
Úgyhogy ez van: 112-től lehet készülni erre a meglepetésre is :)
49

Jogi kérdés ( :D )

mind1 valami név · 2023. Ápr. 20. (Cs), 14.32
Egy site-ról részben ki vannak tiltva az EU-s IP címekről érkező látogatók.
VPN-ről megkerülhető a védelem gond nélkül.
Viszont olyan dilettáns módon van megoldva, hogy amikor az oldal generálódik, akkor változtatja a multimédiás linkeket a valódiról az elutasító üzenetre.
Ha VPN-ről megnyitom, bontom a VPN-t, majd az így kapott linkekre kattintok, már megkapom a kért tartalmat.

A jogi kérdés: vajon ha saját használatra gyártok egy extensiont, ami szépen végigmegy betöltés után az oldalon és az elutasító linkeket az oldal többi adata alapján visszacsinálja a valósra, akkor azzal jogsértést követek-e el?
Mert ha abból indulok ki, hogy VPN-ről használva működik, akkor nem tökmindegy, hogy VPN vagy valami egyéb mód?
Ha abból indulok ki, hogy megkerülök egy védelmi rendszert, bármennyire elb...... is... akkor ugye... :)
50

Csak tipp

Endyl · 2023. Ápr. 20. (Cs), 16.31
Nekem az a tippem, hogy nem akarnak GDPR megfelelők lenni, ezért tiltanak az EU-ból. Szóval ha nem akarod GDPR miatt feljelenteni őket, akkor szerintem senkit sem érdekel. De nem vagyok ügyvéd, és ez nem jogi tanács, csak vélemény :D
51

:) Bocs, ez inkább csak

mind1 valami név · 2023. Ápr. 20. (Cs), 17.40
:) Bocs, ez inkább csak trollkodás volt részemről. Van egy oldal, ahol valami félhülye EU-s törvényre hivatkozva kitiltották az EU usereket, mert a jogvédett képek felhasználásáért akkor is büntethetik az oldalt, ha az EU-n kívüli és a felhasználók töltötték fel.
Hogy ez így jogilag megállja-e a helyét, azt nem tudom (egy amcsi vagy kínai site-ot milyen alapon büntetne egy EU-s szervezet?).
Néha benézek oda és amikor először belefutottam ebbe a marhaságba, akkor vettem észre, hogy a VPN-nel simán kijátszható a "védelem", később meg azt is, hogy rossz helyre tették be az IP cím országának ellenőrzését, így simán megkerülhető. Aztán most, hogy játszom a javascripttel, eszembejutott és megnéztem: két for ciklus meg egy értékadás és működik EU-s címről is.
Viszont egy ideje ugye minden törvénysértő, amivel védelmet megkerül az ember. Tképp az adblock is az, ha úgy vesszük. :D
53

IndexedDB vs privacy...

mind1 valami név · 2023. Ápr. 23. (V), 09.21
Megint egy vicces kis feature.
A google jelen ismeretei szerint nincs eszköz a kezemben, hogy kilistázzam a böngészőmben tárolt IndexedDB adatbázisokat és megnézzem a tartalmukat.
Egyedült a Developer Tools-ban található Storage Inspectort említi a hivatalos doksi is, de azzal csak az épp vizsgálat alatt álló site adatbázisait láthatom.
Ha meglátogatok egy oldalt és az lerak hozzám egy ilyen adatbázist, akkor sosem fogom megtudni, hacsak nem figyelem az ilyen tevékenységeket (bár elnézve, hogy sok oldal hány domainről gyűjti be a használt javascript kódokat, ez is reménytelen vállalkozásnak tűnik)
Gondolom, az aktív profil könyvtárában megtalálhatom .sqlite formában ezeket, de az meg ugye titkosítva van, nem tudom kicsomagolni, hogy megnézzem a tartalmát.
Vicces, na... (nem annyira -> lásd még evercookie és társai)

A poén a dologban, hogy én pont arra akartam használni, hogy egy szavazós oldalon akkor se tudjon valaki többször szavazni, ha törli a cookie-kat a böngészőjéből.
O.K., törölni végső soron lehet őket, de hogy nem tudok belenézni a saját gépemen, a saját böngészőmben, hogy egy idegen oldal mit pottyantott oda...
55

Content scriptből dialog?

mind1 valami név · 2023. Ápr. 24. (H), 08.07
Szeretnék egy olyat, hogy jobbklikk egy adott elemen, dobjon fel egy dialog boxot, amiben bizonyos paramétereket (Szín, fontok stb.) tud beállítani a felhasználó. Mivel ez szorosan kapcsolódik a kattintott elemhez, az extension saját popup menüje nem jó e célra, a window.open szintén nem tűnik nyerő ötletnek.
De akkor hogy a bánatba lehet a content script-tel saját html kódot injektálni a weblapba, lehetőleg úgy, hogy névütközést se okozzak? (O.K., createNode stb., de mi van, ha külső fájlból szeretném betölteni a html-t és css-t, természetesen az extension saját könyvtáraiból?)

Egyébként a Developer Tools konzolon vajon miért nem tudom elérni a browser.runtime interface-t/API-t/objektumot? A content script eléri (legalábbis a sendMessage működik), de a development konzol valamiért nem ismeri, így kipróbálni sem tudok onnan egy csomó dolgot. :(
(most konkrétan a getUrl-t akartam kipróbálni, úgy jött elő, hogy nincs neki olyan)

update: valami olyasmit szeretnék látni, mint amit a uBlock0 művel a jobbklikk, Block Element hatására. Az a baj, hogy az említett extension kódja elég bonyolult ahhoz, hogy egyelőre ne találjak meg benne szinte semmit.

Próbáltam egy olyat, hogy fetch(browser.runtime.getURL('/html/dialog.html')..., de erre meg security error... a válasz, így még betölteni sem tudom a saját html fájlomat a documentum végére...
Korrekció: természetesen a /html/* benne volt a web_accessible_resources listában, manifest v2 alatt működik is, v3 alatt (megfelelően átalakítva persze) nem. Szerettem volna úgy megírni, hogy v3 és fut chrome-on is, de ez végképp esélytelen, mivel pár dologban már manifest szintjén sem kompatibilis a két világ. :(


Kezdek ott tartani megint, hogy ez is megy a korábbi pythonos cuccaim után a kukába. Annyira irritálóan el van bonyolítva az egész. Ha már lehet neki saját resource fájlokat adni, mi a francér' nincs korrekt mód a betöltésükre?

Update n+1: vajon igaza lehet annak a nyomorult chatgpt-nek, hogy manifest v3 esetében csak background script tölthet be fájlt fetch() segítségével? Mert eredetileg v3-mal próbálkoztam, most mindent visszaírtam v2-re, így többé-kevésbé megy a betöltés, bár még nem tudom, ebből lesz-e popup dialog. Viszont v3 alatt képtelen vagyok content script-ből betölteni bármit. :(
56

Most nincs időm mélyebben

Endyl · 2023. Ápr. 24. (H), 09.11
Most nincs időm mélyebben utánanézni, meg gondolom gondoltál is már erre a nyakatekert megoldásra, de ha minden kötél szakad, akkor: üzensz a backgroundnak, hogy küldje át a szükséges html forrást?

Mondjuk fura lenne, ha webről elérhetőek lennének az extension web_accessible_resource-ai, content scriptből meg nem. Másik nyakatekert megoldás: a dialogot megcsinálod scriptből, a tartalma meg egy iframe-ben betölti a web_accessible_resource-t :D

A css elvileg egyszerűbb a loadCSS() függvénnyel, vagy csak statikusan betöltve (bár gondolom ezt is tudod).
57

Köszi, azt nem is várom

mind1 valami név · 2023. Ápr. 24. (H), 09.51
Köszi, azt nem is várom senkitől, hogy a hülyeségeim miatt doksikat túrjon. :)
Csak ha fejből jön valami ötlet.

Aludtam rá egyet, nekiugrok újra a dolognak, mert az biztos, hogy contentből muszáj elérni a web accessible fájlokat, csak az a kérdés, hogy pl. kell-e valami "matches" is hozzá. Eddig nem jutottam el tegnap, mert a kompatibilitási mátrix szerint az egyik variáció nem megy androidos firefox-szal, így azt kihagytam. Majd ma, csak előbb kettéágaztatom v2 és v3 felé, mert eddig simán ment minden verziófüggetlenül, most meg jönnek a csontvázak a szekrényből :)
58

Nekem az lenne a tippem, hogy

Endyl · 2023. Ápr. 24. (H), 10.05
Nekem az lenne a tippem, hogy a matches kell hozzá, ha már web_accessible_resource megjelölés nélkül nem lehet betölteni content scriptből.
59

A doksi (mdn) elég furcsán

mind1 valami név · 2023. Ápr. 24. (H), 10.16
A doksi (mdn) elég furcsán fogalmaz: vagy matches vagy extension_id.
De az sem kizárt, hogy a wildcard nem tetszik neki valahol.
Az meg külön öröm, hogy a chrome.* csak részben van implementálva, a background scripts helyett meg valami worker kellene a v3-ban. A firefox ragaszkodik a background scripthez, a chrome meg a workerhez. :D
60

Úgy fest, valamit elkefélt valaki az "extension_ids"...

mind1 valami név · 2023. Ápr. 24. (H), 13.55
... leírásában vagy implementációjában. Vagy csak elfelejtették leírni, hogy a temporary extensionnel nem megy.
Ezt írja a doksi:
"Each object must include a "resources" property and either a "matches" or "extension_ids" property from the following properties:"
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources

Én ezt úgy értem, hogy kötelező a resources és a matches/extension_ids közül az egyik.
A "matches":"*://*/*" működik (bár van egy olyanom, hogy az utolsó * felesleges).
Viszont az extension_ids-re egy korrektnek nevezhető példát sem találok.
A matches meg azért nem az igazi, mert csak a desktop firefox ismeri, az androidos nem.
Az extension_id jó lett volna ide is, chrome alá is, nem is akarom, hogy más extension piszkálja ezeket, de nem tudom kitalálni, mi is kéne oda. Folyt. köv. (Hogy Fülig Jimmy-t idézzem: "Megfojtatása következik" :D)
61

Extension id firefox oldalon

Endyl · 2023. Ápr. 24. (H), 14.35
Extension id firefox oldalon könnyű. Hogy chrome-nál hogyan lehet vele tesztelni, azt passzolom. Általában magamnak írok dolgokat FF alá. Amit chrome-ról tudok, az mások fórumos/chates kérdéseiből ragadt rám.
62

Van egyszerűbb

mind1 valami név · 2023. Ápr. 24. (H), 14.44
Van egyszerűbb is:
"extension_ids": []

Bár megjegyzem, a linkelt doksiban van valahol egy kitétel, miszerint a wildcard megengedett bárhol - itt is. :)

Szó nélkül megeszi, de önmagában kevés, pedig az "either" tudtommal azt jelenti, hogy akár/egyik stb. A matches nélkül v3 alatt következetesen permission errort vagy mit ír a nyomorult a fetch-re.

Chrome egyelőre nem cél, mivel szinte kizárólag firefox-ot használok, csak pl. Androidon a kiwi browser az egyetlen, amivel egy ilyen extensiont meg lehet etetni, az viszont chrome alapú :)
63

sleep -> new Promise -> nem értem :)

mind1 valami név · 2023. Ápr. 24. (H), 15.02
Valahol találtam egy kódot a korábban már hiányolt sleep() funkcióra. Valahogy így néz ki:
async function sleep(n){
  return new Promise(resolve => setTimeout(resolve, n*1000));
}

await sleep(10);
O.K., értem. Részben. De nem értem, hogy miért írják máshol a setTimeout-ra, hogy async, ha egyszer nem az (await-tel nem lehet megvárni, .then nem tartozik hozzá) - ezt asszem, itt valahol megbeszéltük, csak nem emlékszem a részletekre, szóval ez csak költői kérdés.

De azt a "resolve" nevű valamit nem értem. Jó, én olyan nyelveken szocializálódtam, ahol kötelező volt a változók előzetes deklarációja, minimum egy értékadás formájában. Jól sejtem, hogy ez a fenti kód csak annyi, hogy van egy definiálatlan ("magyarul" undefined) értékű változó, amitől nem dob hibát, csak nem csinál vele semmit?
Ha igen, akkor lehet, hogy működik, de U N D O R Í T Ó :D
64

Szájbarágósan:function

Endyl · 2023. Ápr. 24. (H), 15.23
Szájbarágósan:
function sleep(n) {
	return new Promise(function (resolve) {
		window.setTimeout(function() {
			resolve();
		}, n * 1000);
	});
}

async function letMeSleep() {
	await sleep(10);
}
Azaz a promise-nak egy függvényt kell adni paraméterként. Ez a függvény paraméterként kap két függvényt (ha csak egy van nevesítve, akkor a másik ignorálva van). Az elsővel lehet megoldott állapotba tenni a promise-t, a másodikkal (ha használod) meg hibát jelezni (reject).

A kódban, amit te küldtél példának a resolve függvény közvetlenül van átadva a setTimeout callbackjeként.

Update: maximum úgy async a setTimeout, hogy a hívó kód nem várja meg a callbacknek átadott függvény lefutását.
65

Ez mind tiszta, de a resolve

mind1 valami név · 2023. Ápr. 24. (H), 15.45
Ez mind tiszta, de a resolve abban a környezetben (szerintem) egy undefined valami, nem?
Az egészből egyedül az zavar, hogy az itt resolve-nak nevezett változó sehol sem kap értéket. (mondjuk ha a helyére a setTimeout-ba azt írom, hogy undefined, akkor nem tudom, mi történik, mert akkor a mögé írt parancs nem fut le :) )
66

async function sleep(n){ //

Endyl · 2023. Ápr. 24. (H), 15.58
async function sleep(n){
	// Egy arrow függvényt kap paraméterként a new Promise()
	// ami első paraméterként kap egy függvényt
	// ez lesz a resolve
	//                  ↓₋ itt kap értéket a resolve
	return new Promise(resolve => setTimeout(resolve, n*1000));
}
68

Utálom a JS-t...Valójában

mind1 valami név · 2023. Ápr. 24. (H), 16.40
Utálom a JS-t...
Valójában nem ott kap értéket ahol megjelölted, ott csak a hivatkozás van, hogy az átadott anonim függvénynek van egy (vagy két) paramétere, amit a Promise objektum konstruktora(??) kitölt.
Ez az a pont, ahol azt hiszem, a funkcionális nyelvekből átvett borzalmak kezdenek eluralkodni rajta: a hivatkozott pontra egy függvényhivatkozást kell tenni, méghozzá olyat, aminek egy vagy két paramétere van: az első kötelező, ebbe kerül egy függvényhivatkozás valahonnan a Promise osztályon belülről, ami a Promise.resolve() statikus metódusára hivatkozik, míg az opcionális második a .reject() metódusra. Na ezt kerestem én, de csak a sokadik doksiból sikerült megérteni.
Szóval a timeoutos példánál maradva, a setTimeout(Promise.resolve(),n*1000) hajtódik végre a valóságban (mivel statikus metódus, talán még így is tud működni).
Ez hiányzott nekem a történetből.
67

Máshogy

Endyl · 2023. Ápr. 24. (H), 16.00
// ez
new Promise(resolve => setTimeout(resolve, n*1000));
// egyenértékű ezzel
new Promise(function(resolve) {
	return setTimeout(resolve, n*1000);
});
69

Hozzáadnék a laphoz egy popup

mind1 valami név · 2023. Ápr. 25. (K), 12.12
Hozzáadnék a laphoz egy popup dobozt content scriptből.
Hova szokás/illik/szabad hozzácsapni?
Addig megvan, hogy
const div=document.createElement("div")
div.id="llkmlkmlkml" /* ??? ide mit tudok írni, hogy biztosan ne legyen névütközés? Generálok valami random stringet és getElementById-vel lekérem, van-e már ilyen? */
dialog=await fetch(...).then(res=>res.text());
div.innerHTML=dialog;
De mit csináljak a div változómmal? Az első ötletem az volt, hogy document.body.appendChild(div) de... jó ez így?
És akkor még ott van, hogy a megjelenítése is "érdekesnek" tűnik, mert ugye minden css paramétere üres ilyenkor, emiatt széle-hossza=0.

ui: ezt próbáltam a stackoverflow-n is megkérdezni, de csak egy -1-re futotta a 20 látogatótól. :D
70

Nem feltétlenül kell ID

Endyl · 2023. Ápr. 25. (K), 12.56
(function() {
	const main = {
		dialogDiv: null,
		async init() {
			if (main.dialogDiv) { return; }
			
			const dialogResponse = await fetch(/* ... */);
			const dialogSource = await dialogResponse.text();
			main.dialogDiv = main.createDialog(dialogSource);

			window.addEventListener('click', function (event) {
				if (main.shouldShowDialog(event)) {
					main.showDialog();
				}
			});
		},
		createDialog(dialogSource) {
			const div = document.createElement('div');
			// osztály, data-* attribútum, stb. css-hez
			div.classList.add('my-super-class');
			div.innerHTML = dialogSource;
			return div;
		},
		shouldShowDialog(event) {
			/* ... */
		},
		showDialog() {
			// ha elrejtéskor ki is veszed a DOM-ból
			document.body.appendChild(main.dialogDiv);
			/* ... */
		},
	};

	main.init().catch(error => {
		console.log('Error in main init', error);
	});
})();
Simán megtarthatod rá a hivatkozást, nem kell id. A megjelenítési problémára meg megoldás, hogy betöltöd előre a CSS-t.
71

Köszi szépen! Csak abból

mind1 valami név · 2023. Ápr. 25. (K), 13.28
Köszi szépen!

Csak abból indultam ki, hogy ha nincs id/class, akkor külső CSS-t nem tudok ráhúzni (legalábbis jelen ismereteim szerint, anélkül meg kilométeres kódot írhatok, mire megkap mindent ami fontos.
72

Classt nyugodtan lehet

Endyl · 2023. Ápr. 25. (K), 13.33
Classt nyugodtan lehet használni szerintem. Attribútumok alapján (data-*) is jól megy a CSS. ID-t csak ott érdemes használni, ahol HTML miatt kötelező (anchor linkek, label for, stb.).
73

Na jó, csak ha sikerül

mind1 valami név · 2023. Ápr. 25. (K), 13.51
Na jó, csak ha sikerül beletalálni egy olyan class névbe, amit maga az oldal használ, akkor koppantam egy nagyot ;)

Full off: CSS-ről jutott eszembe... le lehet tiltani a szövegkijelölést. Könyörgöm, minek? Mobilon még so so, de desktopon nyomok egy F12-t és másolom amit akarok. :D (van egy oldal, amin érdemi tartalom alig, de rettegnek, hogy valaki nehogy ellopja a semmit. Hihetetlen, na... :( )
74

Polling

mind1 valami név · 2023. Május. 3. (Sze), 17.00
Azt írja a nagykönyv, hogy setInterval belsejében ne használjunk hálózatos függvényeket, mert esetleg sokkal lassabban válaszolnak, mint a megadott időintervallum, emiatt feltorlódnak a kérések és nem a megfelelő sorrendben futnak le végül.
O.K. Használjak helyette setTimeout-ot.
De az hosszú távon nem vezet memória szivárgásra emlékeztető állapothoz?
Merthogy az a doksi szerint is rekurzív, ha a setTimeout-ban megadott függvényben adok újabb timeoutot...

Mert ugye egy
setInterval(()=>{ fetch().then().then(); }, 10000);
elég kényelmes, amíg a fetch által megszólított szerver válaszolt. De ha nem...
Szóval ez valóban nem tűnik jónak.

setTimeout(()=>{ fetch().then().then(); setTimeout(???,10000)}, 10000);
De ez sem... Ugye a ???...
async function getnet(){
  await fetch().then().then();
  setTimeout(getnet, 10000);
}

getnet();
Ez lenne "a" megoldás??
Mondjuk tekintettel arra, hogy a setTimeout nem igazán async függvény, inkább multithreading környezetbe tenném... Talán mégsem annyira gázos, mint elsőre gondoltam.
75

extensionből form data

mind1 valami név · 2023. Május. 14. (V), 08.17
Szerettem volna törlés előtt listázni egy adott oldal adott formjáról mentett adatokat. (konkrétan localhost login képernyőn lévő egyetlen "nick" mezőbe mentett kismillió szemetet)
Ezt vajon hogy lehet?
A browser.browsingData csak törlést ismer :(
(ChatGPT itt is hallucinált egy jót :D)

Ui: itt a hangsúly az extension használatán van, mert ha nem akarok kézzel nekiesni és a DEL gombot nyomkodni, sqlite kliensből akkor is hozzá lehet férni. Csak azt nem látom, hogy API-n keresztül ez elérhető lenne...
76

Miért csak firefox alatt működik? (terhelés teszt)

mind1 valami név · 2023. Május. 16. (K), 21.26
Nem igazán értem a dolgot.
async function test2(){
    const container = document.getElementsByClassName("container")[0];
    let testfile;
    container.innerHTML = "";
    await fetch("/api/testfile?buffer=0").then((e) => e.json()).then((x) => testfile=x);
    testfile.forEach((line, index) => {

        let element = document.createElement("span");
        element.classList.add("item");
        element.style.backgroundColor = "#ffffff";
        container.appendChild(element);
        let fd = new FormData();
        fd.set("comment", line);
        fetch("/api/add",
            {
                method:"POST", 
                body: fd
            })
        .then((x) => x.json()).catch((err) => console.log(err))
        .then((r) => {
            if(r.return_code==0){
                element.style.backgroundColor = "green";
            } else {
                element.style.backgroundColor = "red";
                element.title = r.exception;
                console.log("Error:", r.exception);
            }
        }).catch((err) => console.log(err))
    })

}

const bt = document.getElementById("start")
bt.addEventListener("click", (e) => test2())
Firefox alatt nagyjából az történik, amit vártam tőle: rengeteg fehér->zöld téglalap, nagyjából szekvenciálisan, esetenként egy-egy fehéren marad egy rövid időre, mások bepirosodnak mikor hibára fut a fetch. (A szerveren a /api/add csak beszúr egy sort egy sqlite/mysql táblába, a /api/testfile visszaad egy textfájlt részben vagy egészben, buffer mérettől függően)

Chromium és Opera alatt viszont...
Az egész úgy működne, hogy a
 await fetch("/api/testfile?buffer=300000").then((e) => e.json()).then((x) => testfile=x);
sor letölt egy fix fájlt a szerverről (a buffer mérete határozza meg, hogy kb. mennyit - így pár százat, ha nullára teszem, akkor húszezer sort), minden sorhoz indít egy async fetch műveletet, ami elvileg a szervernek beküldi a sort, hogy szúrja be az adatbázisba, majd a hozzá tartozó téglalapot színezze zöldre, ha sikeres a művelet, pirosra, ha hibára futott.
Firefox esetében kb. ez történik(*), ellenben a chromium és az opera lefagynak a 20000 soros verziótól, míg a fenti beállításnál úgy a feladatok felénél teleírja a konzolt net::ERR_INSUFFICIENT_RESOURCES hibával. O.K., a húszezer fetch élő alkalmazásban túlzás lenne, de egy néhány százas nagyságrend? Mondjuk egy Single Page App esetén?
Meg lehet valahogy előzni ezt anélkül, hogy a hibára futó fetch-eket x idő elteltével újraindítom? Annyit azóta találtam, hogy a chromium (opera is arra épül :( ) eléggé korlátozottan bocsájtja rendelkezésre az erőforrásokat, szóval a hibák mondhatni normálisak, de egyelőre ötletem sincs, hogy adott esetben ezt hogyan lehet kiküszöbölni kulturált módon.

* - na azért a firefox sem tiszta történet. Egy darabig nyomja a hibára futó fetch-ek üzeneteit a konzolra, majd gondol egyet, törli a konzol tartalmát és többé meg se nyikkan. Közben még dolgozik a script a háttérben. WTF?

Ehhez lazán kapcsolódik, de fogalmam sincs, milyen témakör, hogy ha a mysql szervert futtató docker konténerben belépek root-ként az adatbázisba és ottmaradok ÉS újraindítom a uwsgi szervert, akkor a firefox-ból induló első kb. száz-százhúsz requestből néhány hibára fut (2013, Lost connection to MySQL server).
Van valakinek ötlete, hogy merre keressek? Itt az a furcsa, hogy ha nem indítom újra a uwsgi-t vagy nem vagyok belépve az adatbázisba, akkor nincs ilyen gond vagy legalábbis nem sikerült így reprodukálni.