Preserve chronicle draft text

Author: web3blind

app/index.html

@@ -194,7 +194,7 @@
     <script src="js/ui/screens/character.js?v=20260713b"></script>
     <script src="js/ui/screens/hunt.js?v=20260713d"></script>
     <script src="js/ui/screens/inventory.js?v=20260713a"></script>
-    <script src="js/ui/screens/chronicle.js?v=20260712a"></script>
+    <script src="js/ui/screens/chronicle.js?v=20260713a"></script>
     <script src="js/ui/screens/duel.js"></script>
     <script src="js/ui/screens/arena.js?v=20260621d"></script>
     <script src="js/ui/screens/guild.js?v=20260621l"></script>

app/js/ui/screens/chronicle.js

@@ -12,6 +12,7 @@ var ChronicleScreen = (function() {
     var currentTab = 'all'; // all, guild, friends, world
     var REQUIRED_TAG = '#viz_magic';
     var cachedFeedHtml = {};
+    var DRAFT_KEY = VizMagicConfig.STORAGE_PREFIX + 'chronicle_draft';
 
     function render() {
         var t = Helpers.t;
@@ -34,7 +35,7 @@ var ChronicleScreen = (function() {
                 '<textarea id="chronicle-input" class="input-field" rows="3" ' +
                     'maxlength="' + MAX_POST_LENGTH + '" ' +
                     'placeholder="' + t('chronicle_placeholder') + '" ' +
-                    'aria-label="' + t('chronicle_write') + '"></textarea>' +
+                    'aria-label="' + t('chronicle_write') + '">' + Helpers.escapeHtml(_getDraft()) + '</textarea>' +
                 '<div class="chronicle-compose-footer">' +
                     '<span id="chronicle-char-count" class="chronicle-char-count" aria-live="polite">0/' + MAX_POST_LENGTH + '</span>' +
                     '<button class="btn btn-primary" id="btn-chronicle-send">' + t('chronicle_send') + '</button>' +
@@ -53,6 +54,14 @@ var ChronicleScreen = (function() {
         _loadFeed();
     }
 
+    function _getDraft() {
+        try { return localStorage.getItem(DRAFT_KEY) || ''; } catch (e) { return ''; }
+    }
+
+    function _setDraft(text) {
+        try { localStorage.setItem(DRAFT_KEY, text || ''); } catch (e) {}
+    }
+
     function _tabButton(id, label) {
         var isActive = currentTab === id;
         return '<button class="btn ' + (isActive ? 'btn-primary' : 'btn-secondary') + ' btn-sm chronicle-tab-btn" ' +
@@ -76,6 +85,7 @@ var ChronicleScreen = (function() {
         var counter = Helpers.$('chronicle-char-count');
         if (input && counter) {
             input.addEventListener('input', function() {
+                _setDraft(this.value);
                 var len = this.value.length;
                 counter.textContent = len + '/' + MAX_POST_LENGTH;
                 if (len > MAX_POST_LENGTH) {
@@ -100,6 +110,7 @@ var ChronicleScreen = (function() {
                     _injectLocalPost(text);
                     Toast.success('\u2728 ' + Helpers.t('chronicle_send'));
                     Helpers.$('chronicle-input').value = '';
+                    _setDraft('');
                     Helpers.$('chronicle-char-count').textContent = '0/' + MAX_POST_LENGTH;
                     _loadFeed();
                 }

app/manifest.json

@@ -3,7 +3,7 @@
     "short_name": "VizMagic",
     "description": "Viz Magic — accessible browser RPG on the VIZ blockchain",
     "id": "https://vizmagic.web3blind.xyz/",
-    "start_url": "/?pwa=viz-magic-v57",
+    "start_url": "/?pwa=viz-magic-v58",
     "scope": "/",
     "display": "standalone",
     "display_override": ["standalone", "minimal-ui"],

app/sw.js

@@ -1,5 +1,5 @@
 // Viz Magic — Service Worker
-var CACHE_NAME = 'viz-magic-v57';
+var CACHE_NAME = 'viz-magic-v58';
 var ASSETS = [
     '/',
     '/index.html',

tests/player-bug-regressions.test.js

@@ -348,7 +348,7 @@ test('high-traffic UI narration, screen announcements, and inventory stat labels
 
 test('service worker updates quickly and keeps navigations network-first', function () {
   const swJs = read('app/sw.js');
-  assert.ok(/viz-magic-v57/.test(swJs), 'service worker cache version should be bumped');
+  assert.ok(/viz-magic-v58/.test(swJs), 'service worker cache version should be bumped');
   assert.ok(/self\.skipWaiting\(\)/.test(swJs), 'service worker should activate new cache without waiting for all tabs to close');
   assert.ok(/self\.clients\.claim\(\)/.test(swJs), 'service worker should claim clients after activation');
   assert.ok(/event\.request\.mode === 'navigate'[\s\S]*fetch\(event\.request\)/.test(swJs), 'navigation requests should prefer network to avoid stale cached index');
@@ -397,7 +397,7 @@ test('mobile entry helpers cover keyboard paste, home-screen shortcut, nav parit
   assert.ok(/SoundManager\.setVolume\(sfxVolume \/ 100\)/.test(read('app/js/ui/screens/settings.js')), 'settings should apply stored SFX volume on render');
   assert.ok(/localStorage\.setItem\(STORAGE_PREFIX \+ 'sfx_volume'/.test(read('app/js/ui/sound.js')), 'sound manager should persist SFX volume');
   assert.ok(/var volume = _getStoredNumber\('sfx_volume', 0\.5\)/.test(read('app/js/ui/sound.js')), 'sound manager should restore persisted SFX volume');
-  assert.ok(/viz-magic-v57/.test(read('app/sw.js')), 'service worker cache should be bumped for UI changes');
+  assert.ok(/viz-magic-v58/.test(read('app/sw.js')), 'service worker cache should be bumped for UI changes');
 });
 
 
@@ -527,7 +527,7 @@ test('reported mobile UX issues have explicit fixes', function () {
 
 test('PWA icon and HP heart use expressive color accents', function () {
   assert.ok(/viz-magic-192\.png\?v=20260713a/.test(indexHtml), 'PWA icon link should be cache-busted after plus placement/color update');
-  assert.ok(/viz-magic-v57/.test(read('app/manifest.json')), 'manifest start URL should change so launchers can refresh icons');
+  assert.ok(/viz-magic-v58/.test(read('app/manifest.json')), 'manifest start URL should change so launchers can refresh icons');
   assert.ok(/label:'❤️ HP'/.test(homeJs), 'HP label should use a red heart emoji variant');
 });
 
@@ -676,6 +676,13 @@ test('reported ux polish issues have explicit fixes', function () {
   assert.ok(/matchedVoice/.test(read('app/js/ui/components/battle-narrator.js')), 'male narrator should avoid fake pitch-shift when no male browser voice exists');
 });
 
+
+test('chronicle draft survives rerenders while feed loads', function () {
+  assert.ok(/chronicle.js\?v=20260713a/.test(indexHtml), 'chronicle screen should be cache-busted for draft preservation');
+  assert.ok(/DRAFT_KEY/.test(chronicleJs), 'chronicle should keep a draft key');
+  assert.ok(/_getDraft\(\)/.test(chronicleJs) && /_setDraft\(this\.value\)/.test(chronicleJs), 'typed chronicle text should be restored and saved during rerenders');
+});
+
 if (process.exitCode) {
   process.exit(process.exitCode);
 }