fix(cache): throw when update internal properties of the target (#274)

src/cache.js

@@ -115,9 +115,9 @@ export function get(target, key, fn) {
 }
 
 export function assert(target, key, value, force) {
-  if (context && !force) {
+  if (context && context.target === target && !force) {
     throw Error(
-      `Try to assert value of the '${key}' inside of the value function`,
+      `Try to update the '${key}' property while getting the '${context.key}' property`,
     );
   }
 

test/spec/html.js

@@ -128,6 +128,36 @@ describe("html:", () => {
     });
   });
 
+  it("sets the property value of the nested element", () => {
+    define({
+      tag: "test-html-assert-nested",
+      value: "",
+    });
+
+    define({
+      tag: "test-html-assert",
+      value: "test",
+      target: ({ render }) => render().querySelector("div"),
+      render: ({ value }) =>
+        html`<test-html-assert-nested
+          value="${value}"
+        ></test-html-assert-nested>`,
+    });
+
+    const render = html`<test-html-assert></test-html-assert>`;
+
+    render(fragment);
+
+    const el = fragment.children[0];
+
+    return resolveTimeout(() => {
+      expect(() => {
+        el.value = "other";
+        el.target;
+      }).not.toThrow();
+    });
+  });
+
   describe("attribute expression with combined text value", () => {
     const render = (two, three) => html`
       <div name="test" class="class-one ${two} ${three}"></div>