`.
- `canvas_renderer.js:219` unconditionally calls `document.getElementById('badge-iframe').classList.add('hidden')` without optional chaining (`?.`).
- `client/web_pc/index.html` omitted this element. When `renderLoop()` runs 250ms after dodge, `document.getElementById('badge-iframe')` returns `null`.
- Calling `.classList.add('hidden')` on `null` throws an uncaught `TypeError`, violating the 0 console error requirement and stalling the render loop.
- **Remediation**: Inserting `
I-FRAME
` inside `#hud-char-status-card` in `client/web_pc/index.html` provides the DOM node. When hidden, it occupies 0px; when active, it displays a crisp glowing i-frame indicator.
2. **Root Cause 2 (API Naming Inconsistency Between Shared Modules)**:
- `combat_skills.js:309` expects `sfxEngine.playWeaponSlash()`.
- `sfx_engine.js:195` implemented `playBladeSlash()`.
- Because `client/webapp/` is strictly read-only per Project Directives (to preserve 100% mobile webapp zero-regression), we must NOT touch `combat_skills.js` or `sfx_engine.js`.
- `client/web_pc/js/pc_main.js` is the dedicated orchestration entry point for the PC desktop client.
- **Remediation**: Aliasing `playWeaponSlash` on `SFXEngine.prototype`, `sfxEngine`, and `window.sfxEngine` in `client/web_pc/js/pc_main.js` delegates `playWeaponSlash` directly to `this.playBladeSlash()`. This resolves the exception at 0ms cost with zero impact on `client/webapp/`.
3. **Auxiliary Cause 3 (Redundant Cooldown Trigger)**:
- `window.doDodge()` in `combat_skills.js` already handles `triggerCooldown('dodge', 3.0)`.
- Calling `triggerUiCooldown('dodge', 3.0)` unconditionally in `pc_input_controller.js:195` consumes an extra charge.
- **Remediation**: Restricting `this.triggerUiCooldown('dodge', 3.0)` to the fallback branch (`else if (window.player)`) ensures exactly 1 charge is consumed per roll.
---
## 3. Caveats
- **Read-Only Scope Compliance**: As an Explorer agent, no changes were committed to project files. Remediation must be executed by `worker_18_2`.
- **Base HREF & Script Order**: In `client/web_pc/index.html`, `
` is declared in ``. Module scripts (`sfx_engine.js`, `pc_main.js`) execute in document order. The prototype and instance aliasing in `pc_main.js` must execute at module evaluation time so that direct evaluations (like `window.doPrimaryAttack()`) succeed even before any user clicks occur.
---
## 4. Conclusion & Concrete Implementation Diffs
### Remediation Step 1: Add `#badge-iframe` to `client/web_pc/index.html`
**Target File**: `client/web_pc/index.html` (lines 61–65)
**Location**: Inside `#hud-char-status-card`, within `
` next to `#txt-char-level`.
```diff
--- a/client/web_pc/index.html
+++ b/client/web_pc/index.html
@@ -61,6 +61,7 @@
```
---
### Remediation Step 2: Establish `sfxEngine.playWeaponSlash` Alias in `client/web_pc/js/pc_main.js`
**Target File**: `client/web_pc/js/pc_main.js`
**Description**: Import `sfxEngine` and `SFXEngine`, establish prototype and instance alias at module load, and call `this.initAudioAliasing()` inside `PcMain.init()`.
```diff
--- a/client/web_pc/js/pc_main.js
+++ b/client/web_pc/js/pc_main.js
@@ -6,9 +6,23 @@
import { showTooltip, hideTooltip } from '../../webapp/js/ui/tooltips.js';
import { initChatUI } from '../../webapp/js/ui/chat_ui.js';
import { PcHudController } from './pc_hud_controller.js';
+import { sfxEngine, SFXEngine } from '../../webapp/js/audio/sfx_engine.js';
+
+// Setup SFX alias: playWeaponSlash -> playBladeSlash for combat_skills.js primary attack compatibility
+if (typeof SFXEngine !== 'undefined' && SFXEngine.prototype && !SFXEngine.prototype.playWeaponSlash) {
+ SFXEngine.prototype.playWeaponSlash = function(...args) {
+ return this.playBladeSlash(...args);
+ };
+}
+if (sfxEngine && typeof sfxEngine.playWeaponSlash !== 'function') {
+ sfxEngine.playWeaponSlash = function(...args) {
+ return this.playBladeSlash(...args);
+ };
+}
export const PcMain = {
init() {
+ this.initAudioAliasing();
this.initPcHud();
this.initTooltips();
this.initNavButtons();
@@ -153,6 +167,20 @@
}
},
+ initAudioAliasing() {
+ if (window.sfxEngine && typeof window.sfxEngine.playWeaponSlash !== 'function') {
+ window.sfxEngine.playWeaponSlash = function(...args) {
+ return (this.playBladeSlash || window.sfxEngine.playBladeSlash).apply(this, args);
+ };
+ }
+ if (window.SFXEngine && window.SFXEngine.prototype && typeof window.SFXEngine.prototype.playWeaponSlash !== 'function') {
+ window.SFXEngine.prototype.playWeaponSlash = function(...args) {
+ return this.playBladeSlash.apply(this, args);
+ };
+ }
+ },
+
initAudioUnlock() {
const unlock = () => {
```
---
### Remediation Step 3 (Auxiliary): Fix Dodge Charge Double Decrement in `client/web_pc/js/pc_input_controller.js`
**Target File**: `client/web_pc/js/pc_input_controller.js` (lines 186–197)
```diff
--- a/client/web_pc/js/pc_input_controller.js
+++ b/client/web_pc/js/pc_input_controller.js
@@ -186,13 +186,13 @@
if (e.code === 'Space') {
e.preventDefault();
if (typeof window.doDodge === 'function') {
window.doDodge();
} else if (window.player) {
window.player.isIFrame = true;
window.player.iFrameTimer = 0.25;
window.player.animState = 'dodge';
+ this.triggerUiCooldown('dodge', 3.0);
}
- this.triggerUiCooldown('dodge', 3.0);
return;
}
```
---
### Remediation Step 4: Unit Test Assertion Hardening
**Target File**: `tests/unit/test_pc_web_client.py`
In `test_index_html_action_hud_and_dual_orbs`, add:
```python
self.assertIn('id="badge-iframe"', content, "Must contain badge-iframe element to prevent canvas_renderer.js null dereference")
```
---
## 5. Verification Method
Once `worker_18_2` applies the changes, run the following verification commands:
```bash
# 1. Verify Primary Attack sfxEngine.playWeaponSlash evaluates cleanly to 'OK':
python .agents/teamwork/reviewer_18_2/test_do_primary.py
# 2. Verify Spacebar dodge i-frame expiry (0 classList errors) and charge retention (leaves 2 charges):
python .agents/teamwork/challenger_18_1/test_targeted_findings.py
# 3. Verify all 10 individual input actions execute with 0 page errors:
python .agents/teamwork/reviewer_18_2/test_each_action.py
# 4. Verify full multi-resolution and gameplay resilience harness:
python .agents/teamwork/challenger_18_2/trace_errors.py
# 5. Run full unit and E2E test suites:
pytest tests/unit/test_pc_input_controller.py tests/unit/test_pc_web_client.py tests/unit/test_pc_web_client_layout.py tests/unit/test_mobile_webapp_config.py -v
pytest tests/e2e/test_pc_desktop_client_e2e.py -v
# 6. Verify Code Hygiene & Strict i18n:
python tools/lint/check_code_and_doc_hygiene.py --strict
python tools/lint/check_i18n_hygiene.py --strict
```
### Invalidation Conditions (Fix Success Criteria):
- `test_do_primary.py` outputs: `doPrimaryAttack evaluate result: OK` (0 TypeErrors).
- `test_targeted_findings.py` outputs: `[PAGE ERRORS AFTER IFRAME EXPIRY]: []` and `[CHARGES AFTER 1 SPACE PRESS]: 2`.
- `test_each_action.py` outputs: `0 errors` across all 10 actions (`click`, `KeyQ`, `KeyW`, `KeyE`, `KeyR`, `Key1`, `Space`, `KeyC`, `KeyI`, `Escape`).
- Zero modifications inside `client/webapp/`.