wip

src/cache.js

@@ -100,8 +100,8 @@ export function get(target, key, getter) {
   return entry.value;
 }
 
-export function set(target, key, setter, value) {
-  if (context) {
+export function set(target, key, setter, value, force) {
+  if (context && !force) {
     context = null;
     throw Error(`Try to set '${key}' of '${stringifyElement(target)}' in get call`);
   }

src/store.js

@@ -0,0 +1,52 @@
+import * as cache from './cache';
+
+const metaMap = new WeakMap();
+const _ = (h, v) => v;
+
+function getMeta(Model) {
+  let meta = metaMap.get(Model);
+  if (!meta) {
+    meta = {
+      get: new Set(),
+      set: new Set(),
+    };
+    metaMap.set(Model, meta);
+  }
+  return meta;
+}
+
+export function observe(Model, callbacks = {}) {
+  const meta = getMeta(Model);
+
+  if (callbacks.get) {
+    meta.get.add((id) => {
+      const result = callbacks.get(id);
+      if (result !== undefined) {
+        cache.set(Model, id, _, result, true);
+      }
+    });
+  }
+
+  if (callbacks.set) meta.set.add(callbacks.set);
+
+  return () => {
+    meta.get.delete(callbacks.get);
+    meta.set.delete(callbacks.set);
+  };
+}
+
+export function isReady() {
+  return true;
+}
+
+export function get(Model, id) {
+  const model = cache.get(Model, id, _);
+
+  if (model === undefined) {
+    const meta = getMeta(Model);
+    meta.get.forEach(cb => cb(id));
+    return cache.get(Model, id, _);
+  }
+
+  return model;
+}

src/utils.js

@@ -27,9 +27,8 @@ export function shadyCSS(fn, fallback) {
   return fallback;
 }
 
-export function stringifyElement(element) {
-  const tagName = String(element.tagName).toLowerCase();
-  return `<${tagName}>`;
+export function stringifyElement(target) {
+  return target.tagName ? `<${String(target.tagName).toLowerCase()}>` : target;
 }
 
 export const IS_IE = 'ActiveXObject' in window;

test/spec/store.js

@@ -0,0 +1,34 @@
+import { test, resolveRaf } from '../helpers';
+import { define, html } from '../../src';
+
+import * as store from '../../src/store';
+
+fdescribe('store:', () => {
+  describe('one type with synchronous storage', () => {
+    const Profile = {
+      firstName: '',
+      lastName: '',
+    };
+
+    store.observe(Profile, {
+      get: () => ({ firstName: 'John', lastName: 'Smith' }),
+    });
+
+    define('test-store', {
+      id: '1',
+      profile: ({ id }) => store.get(Profile, id),
+      render: ({ profile }) => {
+        console.log('render');
+        return html`
+          ${profile && html`<h1>${profile.firstName} ${profile.lastName}</h1>`}
+        `;
+      },
+    });
+
+    const tree = test('<test-store></test-store>');
+
+    it('renders profile data', tree(el => resolveRaf(() => {
+      expect(el.shadowRoot.innerHTML.trim()).toBe('<h1>John Smith</h1>');
+    })));
+  });
+});