refactor(vdom): rename function elementFactory() to element()

Makes API more consistent. BREAKING CHANGE: `elementFactory()` function renamed to `element()`
localvoid · May 11, 2018 · 6324a91 · 6324a91
1 parent b591819
commit 6324a91
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 16 deletions.
diff --git a/packages/ivi/__tests__/element_factory.spec.ts b/packages/ivi/__tests__/element_factory.spec.ts
@@ -1,10 +1,10 @@
-import { VNodeFlags, elementFactory } from "ivi";
+import { VNodeFlags, element } from "ivi";
 import * as h from "ivi-html";
 
 const div = h.div();
 const input = h.input();
-const divFactory = elementFactory(div);
-const inputFactory = elementFactory(input);
+const divFactory = element(div);
+const inputFactory = element(input);
 
 test(`div flags`, () => {
   expect(divFactory().flags & ~VNodeFlags.ElementFactory).toBe(h.div().flags);

diff --git a/packages/ivi/__tests__/render_element_factory.spec.ts b/packages/ivi/__tests__/render_element_factory.spec.ts
@@ -1,10 +1,10 @@
-import { elementFactory } from "ivi";
+import { element } from "ivi";
 import * as h from "ivi-html";
 import { startRender } from "./utils";
 
 test(`<div></div>`, () => {
   startRender<HTMLElement>((r) => {
-    const e = elementFactory(h.div());
+    const e = element(h.div());
     const n = r(e());
 
     expect(n.tagName.toLowerCase()).toBe("div");
@@ -13,7 +13,7 @@ test(`<div></div>`, () => {
 
 test(`predefined className: <div class="a"></div>`, () => {
   startRender<HTMLElement>((r) => {
-    const e = elementFactory(h.div("a"));
+    const e = element(h.div("a"));
     const n = r(e());
 
     expect(n.classList.length).toBe(1);
@@ -23,7 +23,7 @@ test(`predefined className: <div class="a"></div>`, () => {
 
 test(`<div class="a"></div>`, () => {
   startRender<HTMLElement>((r) => {
-    const e = elementFactory(h.div());
+    const e = element(h.div());
     const n = r(e("a"));
 
     expect(n.classList.length).toBe(1);
@@ -33,7 +33,7 @@ test(`<div class="a"></div>`, () => {
 
 test(`<div id="123"></div>`, () => {
   startRender<HTMLElement>((r) => {
-    const e = elementFactory(h.div().a({ id: "123" }));
+    const e = element(h.div().a({ id: "123" }));
     const n = r(e());
 
     expect(n.attributes.length).toBe(1);
@@ -43,7 +43,7 @@ test(`<div id="123"></div>`, () => {
 
 test(`render twice: <div id="123"></div>`, () => {
   startRender<HTMLElement>((r) => {
-    const e = elementFactory(h.div().a({ id: "123" }));
+    const e = element(h.div().a({ id: "123" }));
     r(e());
     const n = r(e());
 

diff --git a/packages/ivi/src/index.ts b/packages/ivi/src/index.ts
@@ -14,7 +14,7 @@ export {
   autofocus, stopDirtyChecking,
 } from "./vdom/vnode";
 export { children, map, mapRange } from "./vdom/vnode_collections";
-export { elementFactory } from "./vdom/element";
+export { element } from "./vdom/element";
 export { statefulComponent, statelessComponent, context, connect } from "./vdom/vnode_factories";
 
 /**

diff --git a/packages/ivi/src/vdom/element.ts b/packages/ivi/src/vdom/element.ts
@@ -2,17 +2,28 @@ import { VNodeFlags } from "./flags";
 import { VNode } from "./vnode";
 
 /**
- * elementFactory creates an element factory for an element with predefined attributes.
+ * element creates an virtual DOM node factory that produces elements with predefined attributes.
  *
- * @param element Element prototype.
- * @returns VNode factory function.
+ *     const DivWithIdAttribute = element(
+ *       h.div().a({
+ *         "id": "predefined-id",
+ *       });
+ *     );
+ *
+ *     render(
+ *       DivWithIdAttribute(),
+ *       DOMContainer,
+ *     );
+ *
+ * @param proto virtual DOM element prototype.
+ * @returns factory that produces elements with predefined attributes.
  */
-export function elementFactory<P, N>(element: VNode<P, N>): (className?: string) => VNode<P, N> {
-  const flags = element.flags | VNodeFlags.ElementFactory;
+export function element<P, N>(proto: VNode<P, N>): (className?: string) => VNode<P, N> {
+  const flags = proto.flags | VNodeFlags.ElementFactory;
   return function (className?: string) {
     return new VNode<P, N>(
       flags,
-      element,
+      proto,
       void 0,
       className,
       null,