#296 persist back in

code/go/site/smoketests/dialogs_browser_test.go

@@ -2,6 +2,7 @@ package smoketests
 
 import (
 	"testing"
+	"time"
 
 	"github.com/stretchr/testify/assert"
 )
@@ -19,6 +20,9 @@ func TestExampleDialogsBrowser(t *testing.T) {
 		wait, handle := page.MustHandleDialog()
 		go btn.MustClick()
 
+		//i don't know why this is needed but wait isn't enough
+		time.Sleep(1 * time.Second)
+
 		wait()
 		handle(true, "test")
 		handle(true, "")

code/go/site/smoketests/persist_test.go

@@ -3,13 +3,38 @@ package smoketests
 import (
 	"testing"
 
+	"github.com/Jeffail/gabs/v2"
 	"github.com/stretchr/testify/assert"
 )
 
 func TestExamplePersist(t *testing.T) {
-	t.Skip("skipping TestExamplePersist")
 	g := setup(t)
 
 	page := g.page("examples/persist")
 	assert.NotNil(t, page)
+
+	page.MustWaitIdle()
+
+	expected := "foo"
+
+	checkLocalStorage := func() string {
+		fromLocalStorage := page.MustEval(`k => localStorage[k]`, "foo")
+		marshalled := fromLocalStorage.String()
+		c, err := gabs.ParseJSON([]byte(marshalled))
+		assert.NoError(t, err)
+		actual := c.Path("nested.test1").Data().(string)
+		return actual
+	}
+	assert.Equal(t, expected, checkLocalStorage())
+
+	page.MustWaitIdle()
+
+	input := page.MustElement("#keyInput")
+
+	revisedExpected := "This is a test"
+	input.MustInput(revisedExpected)
+
+	page.MustWaitIdle()
+	assert.Equal(t, expected+revisedExpected, checkLocalStorage())
+
 }

code/go/site/smoketests/session_storage_test.go

@@ -3,13 +3,26 @@ package smoketests
 import (
 	"testing"
 
+	"github.com/Jeffail/gabs/v2"
+	datastar "github.com/starfederation/datastar/sdk/go"
 	"github.com/stretchr/testify/assert"
 )
 
 func TestExampleSessionStorage(t *testing.T) {
-	t.Skip("skipping TestExampleSessionStorage")
 	g := setup(t)
 
 	page := g.page("examples/session_storage")
 	assert.NotNil(t, page)
+
+	page.MustWaitIdle()
+
+	checkSessionStorage := func() float64 {
+		ss := page.MustEval(`k => sessionStorage[k]`, datastar.DatastarKey)
+		marshalled := ss.String()
+		c, err := gabs.ParseJSON([]byte(marshalled))
+		assert.NoError(t, err)
+		actual := c.Path("sessionId").Data().(float64)
+		return actual
+	}
+	assert.Equal(t, float64(1234), checkSessionStorage())
 }

code/go/site/static/md/examples/persist.md

@@ -1,8 +1,8 @@
 ## Demo
 
-<div data-signals="{nested:{test1:'foo',test2:'bar',test3:'baz' }}" data-persist-foo="`nested.test1 nested.test3`">
-    <input class="input input-bordered" data-bind="nested.test1"/>
-    <pre data-text="ctx.signals.JSON()">Replace me</pre>
+<div data-signals="{nested:{test1:'foo',test2:'bar',test3:'baz' }}" data-persist-foo="nested.test1 nested.test3">
+    <input id="keyInput" class="input input-bordered" data-bind="nested.test1"/>
+    <pre data-text="`${ctx.signals.JSON()}`">Replace me</pre>
 </div>
 
 ## Explanation

code/php/sdk/src/Consts.php

@@ -11,8 +11,8 @@ class Consts
 {
     public const DATASTAR_KEY = 'datastar';
     public const VERSION = '0.20.1';
-    public const VERSION_CLIENT_BYTE_SIZE = 32041;
-    public const VERSION_CLIENT_BYTE_SIZE_GZIP = 11809;
+    public const VERSION_CLIENT_BYTE_SIZE = 32309;
+    public const VERSION_CLIENT_BYTE_SIZE_GZIP = 11912;
 
     // The default duration for settling during merges. Allows for CSS transitions to complete.
     public const DEFAULT_SETTLE_DURATION = 300;

library/src/engine/engine.ts

@@ -167,7 +167,7 @@ export class Engine {
         const lastIdx = stmts.length - 1;
         const last = stmts[lastIdx];
         if (!last.startsWith("return")) {
-            stmts[lastIdx] = `return ${stmts[lastIdx]};`;
+            stmts[lastIdx] = `return (${stmts[lastIdx]});`;
         }
         const userExpression = stmts.join("\n");
 

library/src/engine/errors.ts

@@ -1,5 +1,3 @@
-import { DATASTAR } from "./consts";
-
 const url = `http://localhost:8080/errors`;
 
 export const hasValNonExpr = /([\w0-9.]+)\.value/gm;

library/src/plugins/official/browser/attributes/persist.ts

@@ -3,18 +3,45 @@
 // Slug: Persist data to local storage or session storage
 // Description: This plugin allows you to persist data to local storage or session storage.  Once you add this attribute the data will be persisted to local storage or session storage.
 
-import { dsErr, ErrorCodes } from "../../../../engine/errors";
-import { AttributePlugin, PluginType } from "../../../../engine/types";
+import { DATASTAR } from "../../../../engine/consts";
+import {
+    AttributePlugin,
+    NestedValues,
+    PluginType,
+} from "../../../../engine/types";
 
 const SESSION = "session";
-const LOCAL = "local";
-const REMOTE = "remote";
 
 export const Persist: AttributePlugin = {
     type: PluginType.Attribute,
     name: "persist",
-    mods: new Set([LOCAL, SESSION, REMOTE]),
-    onLoad: () => {
-        throw dsErr(ErrorCodes.NotImplementedError);
+    mods: new Set([SESSION]),
+    onLoad: ({ key, value, signals, effect, mods }) => {
+        if (key === "") {
+            key = DATASTAR;
+        }
+        const storage = mods.has(SESSION) ? sessionStorage : localStorage;
+        const paths = value.split(/\s+/).filter((p) => p !== "");
+
+        const storageToSignals = () => {
+            const data = storage.getItem(key) || "{}";
+            const nestedValues = JSON.parse(data);
+            signals.merge(nestedValues);
+        };
+
+        const signalsToStorage = () => {
+            let nv: NestedValues;
+            if (!!!paths.length) {
+                nv = signals.values();
+            } else {
+                nv = signals.subset(...paths);
+            }
+            storage.setItem(key, JSON.stringify(nv));
+        };
+
+        storageToSignals();
+        return effect(() => {
+            signalsToStorage();
+        });
     },
 };

library/src/plugins/official/core/macros/signals.ts

@@ -5,7 +5,7 @@ export const SignalValueMacro: MacroPlugin = {
     type: PluginType.Macro,
     fn: (original: string) => {
         const validJS = /(?<path>[\w0-9.]*)((\.value))/gm;
-        const sub = `ctx.signals.signal('$1')?.value`;
+        const sub = `ctx.signals.signal('$1').value`;
         return original.replaceAll(validJS, sub);
     },
 };

library/src/plugins/official/dom/attributes/class.ts

@@ -16,7 +16,7 @@ export const Class: AttributePlugin = {
             if (key === "") {
                 const classes: Object = rx<Record<string, boolean>>();
                 for (const [k, v] of Object.entries(classes)) {
-                    const classNames = k.split(/\_+/);
+                    const classNames = k.split(/\s+/);
                     if (v) {
                         cl.add(...classNames);
                     } else {

library/src/plugins/official/dom/attributes/text.ts

@@ -3,7 +3,6 @@
 // Slug: Set the text content of an element
 // Description: This attribute sets the text content of an element to the result of the expression.
 
-import { dsErr } from "../../../../engine/errors";
 import { AttributePlugin, PluginType } from "../../../../engine/types";
 
 export const Text: AttributePlugin = {
@@ -13,9 +12,10 @@ export const Text: AttributePlugin = {
         const { el, genRX, effect } = ctx;
         const rx = genRX();
         if (!(el instanceof HTMLElement)) {
-            dsErr("Element is not HTMLElement");
+            // dsErr("Element is not HTMLElement");
         }
         return effect(() => {
+            console.log("Text attribute plugin");
             const res = rx(ctx);
             el.textContent = `${res}`;
         });