Rehefa ampidirinao amin'ny controller ianao dia mametaka bokotra, manetsika ny tapa-kazo, misintona ny trigger ... ary amin'ny maha-mpamorona anao dia tsy mahita izany ianao. Ny navigateur dia maka izany, azo antoka, fa raha tsy misoratra anarana ao amin'ny console ianao dia tsy hita maso izany. Izany no aretin'andoha amin'ny Gamepad API. Efa nisy nandritra ny taona maro izany, ary tena mahery tokoa. Azonao atao ny mamaky bokotra, tapa-kazo, trigger, ny asa. Saingy tsy mikasika izany ny ankamaroan'ny olona. Nahoana? Satria tsy misy hevitra. Tsy misy tontonana amin'ny fitaovana mpamorona. Tsy misy fomba mazava ahafantarana raha manao izay eritreretinao ny mpanara-maso. Toa manidina jamba. Nanelingelina ahy izany mba hananganana fitaovana kely: Gamepad Cascade Debugger. Raha tokony hibanjina ny vokatra console ianao, dia mahazo fijery mivantana sy ifanakalozan-kevitra momba ny mpanara-maso. Tsindrio zavatra dia mihetsika eo amin'ny efijery. Ary miaraka amin'ny CSS Cascade Layers, ny fomba dia mijanona ho voalamina, noho izany dia madio kokoa ny debug. Ato amin'ity lahatsoratra ity, hasehoko anao ny antony mahatonga ny fanaintainan'ny debugging, ny fomba anampian'ny CSS hanadio azy, ary ny fomba ahafahanao manangana debugger maso azo ampiasaina indray ho an'ny tetikasanao manokana.
Na dia azonao atao aza ny manoratra azy rehetra, dia hiafara haingana amin'ny spam console tsy azo vakina ianao. Ohatra: [0,0,1,0,0,0,5,0,...] [0,0,0,0,1,0,0,...] [0,0,1,0,0,0,0,...]
Azonao lazaina ve hoe inona no bokotra voatsindry? Angamba, fa aorian'ny fanerena ny masonao sy ny tsy fisian'ny fampidirana vitsivitsy. Noho izany, tsia, tsy mora ny debugging rehefa mamaky ny fampidirana. Olana 3: Tsy fahampian'ny rafitra Na dia manambatra visualizer haingana aza ianao, dia mety hikorontana haingana ny fomba. Mety mifanipaka ny fanjakana default, mavitrika, ary debug, ary raha tsy misy rafitra mazava dia lasa marefo sy sarotra ny manitatra ny CSS-nao. Afaka manampy ny CSS Cascade Layers. Izy ireo dia manambatra ny fomba ho "sosona" izay voafaritry ny laharam-pahamehana, noho izany dia atsahatrao ny miady amin'ny maha-tokana sy maminavina hoe: "Nahoana no tsy miseho ny fomba debug-ko?" Ho solon'izay, mitazona olana samihafa ianao:
Base: Ny fenitry ny controller, ny endriny voalohany. Mavitrika: Misongadina ho an'ny bokotra voatsindry sy tsorakazo mihetsika. Debug: Overlays ho an'ny developer (oh : famakiana isa, mpitari-dalana, sns).
Raha hamaritra sosona amin'ny CSS araka izany isika dia manana: /* ambany indrindra hatramin'ny laharam-pahamehana*/ @layer base, active, debug;
@lay fototra { /* ... */ }
@layer active { /* ... */ }
@layer debug { /* ... */ }
Satria ny sosona tsirairay dia mitombina mialoha, fantatrao foana izay fitsipika mandresy. Io vinavina io dia mahatonga ny debugging tsy ho mora kokoa, fa tena azo fehezina. Norakofanay ny olana (fampidirana tsy hita maso, mikorontana) sy ny fomba fiasa (debugger hita maso namboarina tamin'ny Cascade Layers). Ankehitriny isika dia handeha amin'ny dingana manaraka amin'ny fananganana ny debugger. Ny Hevitra Debugger Ny fomba tsotra indrindra ahafahana mampiseho ny fidirana miafina dia ny manao sary eo amin'ny efijery fotsiny. Izany no ataon'ity debugger ity. Ny bokotra, ny trigger ary ny joystick dia mahazo sary avokoa.
Press A: Misy faribolana mirehitra. Atsofohy ny tapa-kazo: Mihodikodina ny faribolana. Sintonina antsasa-manila: Misy bar iray mameno ny antsasany.
Tsy mibanjina ny 0s sy 1s ianao izao, fa tena mijery mivantana ny mpanara-maso. Mazava ho azy, raha vao manomboka manangom-bola amin'ny fanjakana toy ny default, voatsindry, debug info, mety ho fomba firaketana mihitsy aza, manomboka mihamitombo sy sarotra kokoa ny CSS. Eo no ilaina ny sosona cascade. Ity misy ohatra nalaina sary: @lay fototra { .button { fiaviana: #222; sisin-tany: 50%; sakany: 40px; haavony: 40px; } }
@layer active { .button.voatsindry { ambadika: #0f0; /* maitso mavana */ } }
@layer debug { .button::aorian'ny { votoaty: attr(data-value); haben'ny endri-tsoratra: 12px; loko: #fff; } }
Zava-dehibe ny filaharan'ny sosona: base → active → debug.
base misintona ny controller. mavitrika mitantana fanerena fanjakana. debug atsipy amin'ny overlay.
Ny fandravana azy tahaka izao dia midika fa tsy miady amin'ny ady manokana hafahafa ianao. Ny sosona tsirairay dia manana ny toerany, ary fantatrao foana izay mandresy. Manangana azy io Andeha isika haka zavatra eo amin'ny efijery aloha. Tsy mila mijery tsara izany - mila misy fotsiny mba hananantsika zavatra hiarahana.
Debugger Cascade Gamepad
Boaty fotsiny izany. Tsy mbola mampientam-po, fa manome antsika tànana horaisina amin'ny CSS sy JavaScript. Eny, mampiasa sosona cascade aho eto satria mitazona zavatra voalamina rehefa manampy fanjakana bebe kokoa ianao. Ity misy dingana sarotra:
/* ================================================== CASCADE LAYERS SETUP Zava-dehibe: base → active → debug ================================================== */
/* Farito ny filaharana sosona eo anoloana */ @layer base, active, debug;
/* Layer 1: Fomba fototra - endrika ivelany */ @lay fototra { .button { fiaviana: #333; sisin-tany: 50%; sakany: 70px; haavony: 70px; fampisehoana: flex; justify-content: afovoany; align-item: afovoany; }
.pause { sakany: 20px; haavony: 70px; fiaviana: #333; fampisehoana: inline-block; } }
/* Layer 2: Active states - mitantana bokotra voatsindry */ @layer active { .button.active { ambadika: #0f0; /* Maitso mamiratra rehefa tsindriana */ manova: mizana(1.1); /* Mampitombo kely ny bokotra */ }
.pause.active { ambadika: #0f0; manova: scaleY(1.1); /* Mitsotra mitsangana rehefa tsindriana */ } }
/* Layer 3: Debug overlays - info developer */ @layer debug { .button::aorian'ny { votoaty: attr(data-value); /* Mampiseho ny sanda isa */ haben'ny endri-tsoratra: 12px; loko: #fff; } }
Ny hatsaran'ity fomba fiasa ity dia manana tanjona mazava ny sosona tsirairay. Ny sosona fototra dia tsy afaka manongotra ny mavitrika na oviana na oviana, ary ny mavitrika dia tsy afaka manongotra ny debug, na inona na inona manokana. Izany dia manafoana ny ady manokana amin'ny CSS izay mazàna mamely ny fitaovana debugging. Ankehitriny dia toa misy cluster sasany mipetraka amin'ny ambadika maizina. Raha ny marina, tsy dia ratsy loatra.
Manampy ny JavaScript Ora JavaScript. Eto no tena manao zavatra ny controller. Hanamboatra ity dingana ity isika. Dingana 1: Manangana Fitantanana Fanjakana Voalohany, mila varimbazaha isika hanaraha-maso ny toetry ny debugger: // ================================================== // FITANTANANA NY FANJAKANA // ==================================================
avelao mihazakazaka = diso; // Manara-maso raha miasa ny debugger avelao rafId; // Mitahiry ny ID requestAnimationFrame ho fanafoanana
Ireo variables ireo dia mifehy ny loop animation izay mamaky tsy tapaka ny fampidirana gamepad. Dingana 2: Grab DOM References Manaraka, mahazo references amin'ny singa HTML rehetra havaozinay izahay: // ================================================== // DOM ELEMENT REFERENCES // ==================================================
const btnA = document.getElementById("btn-a"); const btnB = document.getElementById("btn-b"); const btnX = document.getElementById("btn-x"); const pause1 = document.getElementById("pause1"); const pause2 = document.getElementById("pause2"); const status = document.getElementById("status");
Ny fitehirizana ireo references ireo dia mahomby kokoa noho ny manontany ny DOM imbetsaka. Dingana 3: Ampio Keyboard Fallback Ho an'ny fitsapana tsy misy mpanara-maso ara-batana dia hataontsika sarintany amin'ny bokotra ny fanalahidin'ny klavier: // ================================================== // KEYBOARD FALLBACK (ho fitiliana tsy misy mpanara-maso) // ==================================================
const keyMap = { "a": btnA, "b": btnB, "x": btnX, "p": [pause1, pause2] // 'p' dia mifehy ny bara fiatoana roa };
Izany dia mamela antsika hitsapa ny UI amin'ny fanindriana ny fanalahidy amin'ny klavier. Dingana 4: Mamorona The Main Update Loop Eto no mitranga ny majika. Ity fiasa ity dia mandeha tsy tapaka ary mamaky ny toetry ny gamepad: // ================================================== // MAIN GAMEPAD UPDATE LOOP // ==================================================
function updateGamepad() { // Raiso ny gamepads mifandray rehetra const gamepads = navigator.getGamepads(); raha miverina (!gamepads);
// Ampiasao ny gamepad voalohany mifandray const gp = gamepads[0];
raha (gp) { // Manambara ny bokotra fanavaozana amin'ny alàlan'ny fanodina ny kilasy "mavitrika". btnA.classList.toggle("active", gp.buttons[0].voatsindry); btnB.classList.toggle("active", gp.buttons[1].voatsindry); btnX.classList.toggle("active", gp.buttons[2].voatsindry);
// Mitantana bokotra fiatoana (fanondroana bokotra 9 amin'ny ankamaroan'ny mpanara-maso) const pausePressed = gp.buttons[9].voatsindry; pause1.classList.toggle("active", pausePressed); pause2.classList.toggle("active", pausePressed);
// Manangana lisitry ny bokotra voatsindry amin'izao fotoana izao mba hanehoana ny sata avelao tsindriana = []; gp.buttons.forEach((btn, i) => { raha (btn.voatsindry)pressed.push("Button" + i); });
// Havaozy ny lahatsoratra momba ny sata raha misy bokotra voatsindry raha (voatsindry.lava > 0) { status.textContent = "voatsindry: " + pressed.join(", "); } }
// Tohizo ny loop raha mandeha ny debugger raha (mihazakazaka) { rafId = requestAnimationFrame(updateGamepad); } }
Ny fomba classList.toggle() dia manampy na manaisotra ny kilasy mavitrika mifototra amin'ny hoe voatsindry ny bokotra, izay manetsika ny style layer CSS. Dingana 5: Mitantana hetsika Keyboard Ireo mpihaino hetsika ireo dia mampandeha ny fihemorana kitendry: // ================================================== // MPANDROSO NY HEVITRA KEYBOARD // ==================================================
document.addEventListener("keydown", (e) => { raha (keyMap[e.key]) { // Mitantana singa tokana na maromaro raha (Array.isArray(keyMap[e.key])) { keyMap[e.key].forEach(el => el.classList.add("active")); } hafa { keyMap[e.key].classList.add("active"); } status.textContent = "Key voatsindry: " + e.key.toUpperCase(); } });
document.addEventListener("keyup", (e) => { raha (keyMap[e.key]) { // Esory ny fanjakana mavitrika rehefa mivoaka ny fanalahidy raha (Array.isArray(keyMap[e.key])) { keyMap[e.key].forEach(el => el.classList.remove("active")); } hafa { keyMap[e.key].classList.remove("active"); } status.textContent = "Key navoaka: " + e.key.toUpperCase(); } });
Dingana 6: Ampio Start / Stop Control Farany, mila fomba iray hamehezana sy hamonoana ny debugger isika: // ================================================== // ATAOVY DEBUGGER ON/OFF // ==================================================
document.getElementById("toggle").addEventListener("click", () => { mihazakazaka = !mihazakazaka; // Atsipazo ny fanjakana mihazakazaka
raha (mihazakazaka) { status.textContent = "Debugger mihazakazaka..."; updateGamepad(); // Atombohy ny loop update } hafa { status.textContent = "Debugger tsy mavitrika"; cancelAnimationFrame(rafId); // Atsaharo ny loop } });
Eny ary, tsindrio bokotra iray dia mamirapiratra. Tosika ny tapa-kazo dia mihetsika. Dia izay. Zavatra iray hafa: ny soatoavina manta. Indraindray ianao te hahita isa fotsiny fa tsy jiro.
Amin'ity dingana ity dia tokony ho hitanao:
Controller tsotra eo amin'ny efijery, bokotra izay mihetsika rehefa mifandray amin'izy ireo ianao, ary Famakiana debug azo atao mampiseho tondro bokotra voatsindry.
Mba hahatonga an'io tsy ho saro-pantarina io, ity misy demo haingana momba ny mpanara-maso eo amin'ny efijery mihetsika amin'ny fotoana tena izy:
Amin'izao fotoana izao, tsindrio ny Start Recording dia mirakitra ny zava-drehetra mandra-pahatonganao amin'ny Stop Recording. 2. Manondrana angona amin'ny CSV/JSON Rehefa manana diary isika dia te-hitahiry izany.
Dingana 1: Mamorona ny Download Helper Voalohany, mila fiasa mpanampy isika izay mitantana ny fampidinana rakitra ao amin'ny navigateur: // ================================================== // FILE DOWNLOAD HELPER // ==================================================
function downloadFile(anaran-drakitra, atiny, karazana = "text/plain") { // Mamorona blob avy amin'ny atiny const blob = new Blob([votoaty], {karazana}); const url = URL.createObjectURL(blob);
// Mamorona rohy fampidinana vonjimaika ary tsindrio izany const a = document.createElement("a"); a.href = url; a.download = anaran-drakitra; a.click();
// Diovy ny URL zavatra aorian'ny fampidinana setTimeout(() => URL.revokeObjectURL(url), 100); }
Ity fiasa ity dia miasa amin'ny famoronana Blob (zavatra lehibe mimari-droa) avy amin'ny angonao, mamorona URL vonjimaika ho azy, ary manindry rohy fampidinana amin'ny programa. Ny fanadiovana dia miantoka fa tsy misy fitadidiana izahay. Dingana 2: Mitantana JSON Export JSON dia tonga lafatra amin'ny fitahirizana ny rafitra angon-drakitra feno:
// ================================================== // EXPORT AS JSON // ==================================================
document.getElementById("export-json").addEventListener("click", () => { // Jereo raha misy zavatra haondrana raha (!frames.length) { console.warn("Tsy misy firaketana azo aondrana."); fiverenana; }
// Mamorona entana misy metadata sy frame const payload = { CreateAt: Date vaovao().toISOString(), frames };
// Ampidino amin'ny endrika JSON downloadFile( "gamepad-log.json", JSON.stringify(payload, null, 2), "application/json" ); });
Ny endrika JSON dia mitazona ny zava-drehetra ho voalamina sy mora azo, ka mahatonga azy io ho tonga lafatra amin'ny famerenana indray amin'ny fitaovana dev na fizarana amin'ny mpiara-miasa. Dingana 3: Mitantana CSV Export Ho an'ny fanondranana CSV dia mila mamaha ny angon-drakitra ambaratonga ho andalana sy tsanganana isika:
//================================================== // EXPORT HO CSV // ==================================================
document.getElementById("export-csv").addEventListener("click", () => { // Jereo raha misy zavatra haondrana raha (!frames.length) { console.warn("Tsy misy firaketana azo aondrana."); fiverenana; }
// Manangana laharana lohatenin'ny CSV (tsanganana ho an'ny famantaranandro, bokotra rehetra, famaky rehetra) const headerButtons = frames[0].buttons.map((_, i) => btn${i}); const headerAxes = frames[0].axes.map((_, i) => axis${i}); const header = ["t", ...headerButtons, ...headerAxes].join(",") + "\n";
// Manangana andalana data CSV const rows = frames.map(f => { const btnVals = f.buttons.map(b => b.value); miverena [f.t, ...btnVals, ...f.axes].join(","); }).join("\n");
// Misintona ho CSV downloadFile("gamepad-log.csv", lohapejy + andalana, "text/csv"); });
Mamirapiratra ny CSV amin'ny famakafakana angon-drakitra satria misokatra mivantana amin'ny Excel na Google Sheets izy io, mamela anao hamorona tabilao, sivana angon-drakitra, na lamina hita maso. Ankehitriny rehefa miditra ny bokotra fanondranana, dia hahita safidy roa vaovao ianao eo amin'ny tontonana: Export JSON sy Export CSV. JSON dia tsara raha te hamerina ny log manta ao amin'ny fitaovanao devo ianao na hikorontana manodidina ny rafitra. Ny CSV kosa dia misokatra mivantana amin'ny Excel na Google Sheets mba hahafahanao manao tabilao, manivana, na mampitaha ny fampidirana. Ity sary manaraka ity dia mampiseho ny endriky ny tontonana miaraka amin'ireo fanaraha-maso fanampiny ireo.
3. Snapshot System Indraindray dia tsy mila firaketana feno ianao, fa "screenshot" haingana amin'ny fanjakana fampidirana. Eo no manampy ny bokotra Take Snapshot.
Ary ny JavaScript:
// ================================================== // MIALA SAPSHOT // ==================================================
document.getElementById("snapshot").addEventListener("click", () => { // Raiso ny gamepads mifandray rehetra const pads = navigator.getGamepads(); const activePads = [];
// Tadiavo ary alaivo ny toetry ny gamepad mifandray tsirairay for (const gp of pads) { raha mitohy ny (!gp); // Alefaso ireo slot tsy misy na inona na inona
activePads.push({ id: gp.id, // Anaran'ny mpifehy/modely timestamp: performance.now(), bokotra: gp.buttons.map(b => ({ voatsindry: b. voatsindry, sanda: b.soa })), famaky: [...gp.axes] }); }
// Jereo raha misy gamepads hita raha (!activePads.length) { console.warn("Tsy misy gamepads mifandray amin'ny snapshot."); alert("Tsy misy mpanara-maso hita!"); fiverenana; }
// Log ary ampahafantaro ny mpampiasa console.log("Snapshot:", activePads); fampandrenesana(sary nalaina! Voasambotra ${activePads.length} controller(s).); });
Ny snapshots dia manamaivana ny tena toetran'ny mpanara-maso anao amin'ny fotoana iray. 4. Famerenan'ny Ghost Input Ho an'ny mahafinaritra izao: famerenan'ny ghost input. Mitaky log izany ary mamerina izany amin'ny maso toy ny hoe misy mpilalao phantom mampiasa ny controller.
JavaScript ho an'ny famerenana: // ================================================== // GHOST REPLAY // ==================================================
document.getElementById("replay").addEventListener("click", () => { // Ataovy azo antoka fa manana firaketana hamerenana raha (!frames.length) { alert("Tsy misy firaketana hamerenana!"); fiverenana; }
console.log("Manomboka mamerina matoatoa...");
// Manara-maso ny fotoana ho an'ny fampitahana narindra avelao startTime = performance.now(); avelao frameIndex = 0;
// Avereno indray ny animation loop dingana fiasa () { const izao = performance.now(); const elapsed = izao - startTime;
// Ampidiro ny sary rehetra izay tokony ho niseho izao raha (frameIndex < frames.lava && frames[frameIndex].t <= efa lasa) { const frame = frames[frameIndex];
// Fanavaozana ny UI miaraka amin'ny bokotra voarakitra btnA.classList.toggle("active", frame.buttons[0].voatsindry); btnB.classList.toggle("active", frame.buttons[1].voatsindry); btnX.classList.toggle("active", frame.buttons[2].voatsindry);
// Fanavaozana ny fampisehoana sata avelao tsindriana = []; frame.buttons.forEach((btn, i) => { if (btn.pressed) pressed.push("Button " + i); }); raha (voatsindry.lava > 0) { status.textContent = "Ghost: " + pressed.join(", "); }
frameIndex++; }
// Tohizo ny loop raha mbola misy frame raha (frameIndex < frames.length) { requestAnimationFrame(dingana); } hafa { console.log("Replayvita."); status.textContent = "Vita ny famerenana"; } }
// Atombohy ny famerenana dingana (); });
Mba hahatonga ny debugging ho mora kokoa amin'ny tanana dia nampiana famerenan'ny matoatoa aho. Raha vantany vao nandrakitra fivoriana ianao dia azonao atao ny mamely ny famerenana ary mijery ny UI manao izany, saika toy ny mpilalao phantom iray mihazakazaka ny pad. Ny bokotra Replay Ghost vaovao dia miseho eo amin'ny tontonana momba izany.
Hit Record, mikorontana kely miaraka amin'ny controller, atsaharo, dia avereno indray. Ny UI dia mamerina ny zavatra rehetra nataonao, toy ny matoatoa manaraka ny fampidiranao. Nahoana no manahirana amin'ireo fanampiny ireo?
Ny fandraketana/fanondranana dia manamora ny ampisehoan'ny mpanandrana ny zava-nitranga. Mivaingana vetivety ny sary, tena ilaina rehefa manenjika bibikely hafahafa ianao. Ny famerenan'ny Ghost dia tsara ho an'ny fampianarana, fisavana fahafahana miditra, na fampitahana fotsiny ny fametrahana fanaraha-maso mifanila.
Amin'izao fotoana izao, tsy demo milamina fotsiny izany, fa zavatra azonao atao. Raharaha Fampiasana Eran-tany Ankehitriny dia manana an'ity debugger ity isika izay afaka manao zavatra betsaka. Mampiseho ny fidirana mivantana, mirakitra ny diary, manondrana azy ireo, ary mamerina zavatra mihitsy aza. Fa ny tena fanontaniana dia hoe: iza no tena miraharaha? Mahasoa an'iza izany? Mpamorona lalao Ny mpanara-maso dia ampahany amin'ny asa, fa ny debugging azy ireo? Matetika fanaintainana. Alaivo sary an-tsaina hoe manandrana combo lalao miady ianao, toy ny ↓ → + punch. Raha tokony hivavaka ianao, dia indroa no nanindry azy toy izany koa, noraketinao indray mandeha, ary averinao indray. vita. Na ampifanakalozanao ny diarin'ny JSON miaraka amin'ny mpiara-miasa iray hanamarina raha toa ka mitovy ny fihetsiky ny kaody Multiplayer anao ao amin'ny milinany. Lehibe izany. Accessibility Practitioners Ity iray ity dia akaiky ny foko. Tsy ny rehetra no milalao miaraka amin'ny "manara-penitra". Mamoaka famantarana hafahafa indraindray ny mpanara-maso adaptive. Miaraka amin'ity fitaovana ity dia afaka mahita tsara ny zava-mitranga ianao. Mpampianatra, mpikaroka, na iza na iza. Azon'izy ireo atao ny maka logs, mampitaha azy ireo, na mamerina ny fidirana mifanila. Tampoka teo dia lasa miharihary ny zavatra tsy hita maso. Fitsapana fiantohana kalitao Matetika ny mpanandrana dia manoratra naoty toy ny hoe "Nopotehiko teto ny bokotra dia tapaka izany." Tsy dia manampy. Ankehitriny? Azon'izy ireo atao ny maka ny milina fanontam-pirinty marina, manondrana ny log ary mandefa azy io. Tsy maminavina. Mpanabe Raha manao fampianarana na horonan-tsary YouTube ianao dia volamena ny famerenana matoatoa. Azonao atao ny miteny ara-bakiteny hoe: "Izao no nataoko tamin'ny mpanara-maso", raha ny UI kosa dia mampiseho izany. Mahatonga fanazavana mazava kokoa. Ankoatra ny lalao Ary eny, tsy momba ny lalao fotsiny izany. Nampiasa mpanara-maso ho an'ny robots, tetikasa zavakanto, ary fifandraisana azo idirana ny olona. Olana mitovy foana: inona no tena hitan'ny navigateur? Miaraka amin'izany dia tsy mila maminavina ianao. Fehiny Toy ny manidina jamba foana ny fandroahana ny fampidirana mpifehy. Tsy toy ny DOM na CSS, tsy misy mpanara-maso naorina ho an'ny gamepads; isa manta fotsiny ao amin'ny console izany, mora very amin'ny tabataba. Miaraka amin'ny andalana HTML, CSS, ary JavaScript an-jatony vitsivitsy, dia namorona zavatra hafa izahay:
Debugger hita maso izay mahatonga ny fidirana tsy hita maso ho hita. Rafitra CSS misy sosona izay mitazona ny UI ho madio sy azo havaozina. Sehatra fanatsarana (fandraiketana, fanondranana, sary, famerenan'ny matoatoa) izay mampiakatra azy avy amin'ny demo mankany amin'ny fitaovana mpamorona.
Ity tetikasa ity dia mampiseho ny halavirana azonao atao amin'ny fampifangaroana ny herin'ny Web Platform miaraka amin'ny famoronana kely ao amin'ny CSS Cascade Layers. Ny fitaovana vao nohazavaiko manontolo dia open-source. Azonao atao ny manao clone ny repo GitHub ary andramo ho anao izany. Fa ny tena zava-dehibe dia azonao atao ny manao azy ho anao manokana. Ampio ny sosonao manokana. Amboary ny lojika replay anao manokana. Ampifandraiso amin'ny prototype lalaonao izany. Na mampiasa azy amin'ny fomba tsy noeritreretiny mihitsy aza. Ho an'ny fampianarana, fahafahana miditra, na famakafakana angona. Amin'ny fiafaran'ny andro, tsy momba ny debugging gamepads fotsiny izany. Mikasika ny famirapiratana amin'ny fampidirana miafina izany, ary manome fahatokisana ny mpamorona hiasa amin'ny fitaovana izay mbola tsy eken'ny tranonkala. Noho izany, ampidiro ny mpanara-maso anao, sokafy ny mpanonta anao ary manomboka manandrana. Mety ho gaga ianao amin'izay tena vitan'ny navigateur sy ny CSS-nao.
