spyne 0.18.2 → 0.19.0

package/src/spyne/views/dom-element-template.js

@@ -1,5 +1,6 @@
 import {includes, __, ifElse, path, prop, reject, is, isNil, isEmpty} from 'ramda';
 
+
 /**
  * @module DomElTemplate
  * @type util
@@ -133,8 +134,11 @@ import {includes, __, ifElse, path, prop, reject, is, isNil, isEmpty} from 'ramd
  */
 
 export class DomElementTemplate {
-  constructor(template, data) {
+  constructor(template, data={}) {
     this.template = this.formatTemplate(template);
+    this.isProxyData = data.__cms__isProxy === true;
+
+
 
     const checkForArrayData = ()=>{
       if (is(Array, data) === true) {
@@ -149,40 +153,60 @@ export class DomElementTemplate {
 
     this.templateData = data;
 
-
     let strArr = DomElementTemplate.getStringArray(this.template);
 
-
     let strMatches = this.template.match(DomElementTemplate.findTmplLoopsRE());
     strMatches = strMatches === null ? [] : strMatches;
 
     const parseTmplLoopsRE = DomElementTemplate.parseTmplLoopsRE();
+
     const parseTmplLoopFn =  this.parseTheTmplLoop.bind(this);
-    const mapTmplLoop = (str, data) => str.replace(parseTmplLoopsRE, parseTmplLoopFn);
-    const findTmplLoopsPred = includes(__, strMatches);
 
+    const mapTmplLoop = (str, data) => {
+      return str.replace(parseTmplLoopsRE, parseTmplLoopFn);
+    }
+
+    const findTmplLoopsPred = includes(__, strMatches);
     const checkForMatches = ifElse(
-      findTmplLoopsPred,
-      mapTmplLoop,
-      this.addParams.bind(this));
+        findTmplLoopsPred,
+        mapTmplLoop,
+        this.addParams.bind(this));
 
     this.finalArr = strArr.map(checkForMatches);
 
   }
 
+  static isPrimitiveTag(str){
+    return  /({{\.\*?}})/.test(str);;
+  }
+
+  // FIND CORRECT NESTED DATA
+  static getNestedDataReducer(data={}, param=""){
+    const dataReducer = (nestedData, str) =>{
+      if (nestedData[str]){
+        return nestedData[str];
+      }
+      return nestedData;
+    }
+    return  /(\.)/gm.test(String(param)) ?  String(param).split('.').reduce(dataReducer,data) : data[param];
+  }
+
   static getStringArray(template) {
     let strArr = template.split(DomElementTemplate.findTmplLoopsRE());
     const emptyRE = /^([\\n\s\W]+)$/;
     const filterOutEmptyStrings = s => s.match(emptyRE);
-    return reject(filterOutEmptyStrings, strArr);
+    const finalStr =  reject(filterOutEmptyStrings, strArr);
+
+    return finalStr;
+
   }
 
   static findTmplLoopsRE() {
-    return /({{#\w+}}[\w\n\s\W]+?{{\/\w+}})/gm;
+    return /({{#[\w.]+}}[\w\n\s\W]+?{{\/[\w.]+}})/gm;
   }
 
   static parseTmplLoopsRE() {
-    return /({{#(\w+)}})([\w\n\s\W]+?)({{\/\2}})/gm;
+    return /({{#([\w.]+)}})([\w\n\s\W]+?)({{\/\2}})/gm;
   }
 
   static swapParamsForTagsRE() {
@@ -196,10 +220,10 @@ export class DomElementTemplate {
   }
 
 
-    /**
-     *
-     * @desc Returns a document fragment generated from the template and any added data.
-     */
+  /**
+   *
+   * @desc Returns a document fragment generated from the template and any added data.
+   */
 
 
   renderDocFrag() {
@@ -207,7 +231,7 @@ export class DomElementTemplate {
     const isTableSubTag =   /^([^>]*?)(<){1}(\b)(thead|col|colgroup|tbody|td|tfoot|tr|th)(\b)([^\0]*)$/.test(html);
     const el = isTableSubTag ? html : document.createRange().createContextualFragment(html);
 
-      window.setTimeout(this.removeThis(), 2);
+    window.setTimeout(this.removeThis(), 2);
     return el;
 
   }
@@ -233,52 +257,97 @@ export class DomElementTemplate {
   }
 
   addParams(str) {
-    //console.time(this.tempL+'9')
     const re = /(\.)/gm;
-
     const replaceTags = (str, p1, p2, p3) => {
-      if (re.test(p2) === false && this.templateData[p2] !==undefined){
-        return this.templateData[p2];
-      }
-      return this.getDataValFromPathStr(p2, this.templateData);
+      return DomElementTemplate.getNestedDataReducer(this.templateData, p2);
     };
-
-   return str.replace(DomElementTemplate.swapParamsForTagsRE(), replaceTags);
+    return str.replace(DomElementTemplate.swapParamsForTagsRE(), replaceTags);
 
   }
 
-  parseTheTmplLoop(str, p1, p2, p3) {
 
-    //console.time(this.tempL+'5b')
+
+
+  parseTheTmplLoop(str, p1, p2, p3) {
+    const dotConverter = str=>`${str.replace(/(\.)/g, "][")}`
     const reDot = /(\.)/gm;
     const subStr = p3;
-    let elData = this.templateData[p2];
-    const parseString = (item, str) => {
+
+    const dataReducer = (acc, str) =>{
+      acc = acc[str];
+      return acc;
+    }
+
+
+    let elData = DomElementTemplate.getNestedDataReducer(this.templateData, p2);
+
+    const arrayStringToObjAdapter = (d,str, i)=>{
+
+      // IF {{.}} RUN parseString
+      if (DomElementTemplate.isPrimitiveTag(str)){
+        return parseString(d, str, i);
+      }
+
+      // CREATE DATA OBJ -- CHECK TO ADD PROXY VALUES
+      const createDataObj = ()=>{
+        const spyneLoopKey = d;
+        const loopIndex = i;
+        const loopNum = i+1;
+
+        if (this.isProxyData) {
+          const __cms__dataId = elData.__cms__dataId;
+          const keyIdStr = `__cms__keyFor_${d}`
+          const origKey = elData[keyIdStr];
+          return {spyneLoopKey, __cms__dataId, origKey, loopIndex, loopNum, d}
+
+        }
+        return {spyneLoopKey, loopIndex, loopNum};
+      }
+
+      return parseObject(createDataObj(), str, i);
+    }
+
+    const parseString = (item, str, index, origIndex) => {
       return str.replace(DomElementTemplate.swapParamsForTagsRE(), item);
     };
-    const parseObject = (obj, str) => {
+
+
+    // PARSING ARRAYS AND OBJECTS
+    const parseObject = (obj, str, i) => {
+      /// LOOP NUMBER VALUES AUTO ADDED
+
+      //const loopIndex = i;
+      //const loopNum = i+1;
+
       const loopObj = (str, p1, p2) => {
         // DOT SYNTAX CHECK
+        const hash = {
+          loopIndex: i,
+          loopNum: i+1
+        }
+
+        // IF {{.}}
         if (reDot.test(p2) === false && obj[p2] !==undefined) {
-          return obj[p2]
+          return hash[p2] !== undefined ? hash[p2] : obj[p2]
         }
 
-        return this.getDataValFromPathStr(p2, obj);
+        const dataReducedVal  = this.getDataValFromPathStr(p2, obj);
+        return hash[p2] !== undefined ? hash[p2] : dataReducedVal
       };
       return str.replace(DomElementTemplate.swapParamsForTagsRE(), loopObj);
     };
-    const mapStringData = (d) => typeof(d) === 'string' ? parseString(d, subStr) : parseObject(d, subStr);
 
+    const mapStringData = (d, i) => typeof(d) === 'string' ? arrayStringToObjAdapter(d, subStr,  i) : parseObject(d, subStr, i);
 
     if (isNil(elData) === true || isEmpty(elData)) {
       return '';
     }
 
     if (elData.length===undefined) {
-          elData = [elData];
-      }
+      elData = [elData];
+    }
 
-     return elData.map(mapStringData).join('');
+    return elData.map(mapStringData).join('');
 
 
   }

package/src/spyne/views/view-stream-element.js

@@ -155,9 +155,17 @@ export class ViewStreamElement {
     let container =  isNil(d.query) ? d.node : d.query;
     let prepend = (node, item) => node.insertBefore(item, node.firstChild);
     let append = (node, item) => node.appendChild(item);
+    let after = (node, item) => node.after(item);
+
+    const defaultFn = prepend;
+    const attachTypeHash = {
+      'appendChild' : append,
+      'after' : after
+    }
     // DETERMINE WHETHER TO USE APPEND OR PREPEND
     // ON CONNECTING DOM ITEMS TO EACH OTHER
-    let attachFunc = d.attachType === 'appendChild' ? append : prepend;
+    //let attachFunc = d.attachType === 'appendChild' ? append : prepend;
+    const attachFunc = attachTypeHash[d.attachType] || defaultFn;
     attachFunc(container, this.domItem.render());
     this.setAnimateIn(d);
   }

package/src/spyne/views/view-stream-payload.js

@@ -1,4 +1,5 @@
 import {SpyneAppProperties} from '../utils/spyne-app-properties';
+import {safeClone} from '../utils/safe-clone';
 import { gc } from '../utils/gc';
 import {
   compose,
@@ -36,7 +37,8 @@ export class ViewStreamPayload {
 
   sendToDirectorStream(payload) {
     let directorStream$ = SpyneAppProperties.channelsMap.getStream('DISPATCHER');
-    const frozenPayload = ViewStreamPayload.deepClone(payload);
+    const frozenPayload = safeClone(payload);
+    //console.log("VS PAYLOAD ",frozenPayload);
     directorStream$.next(frozenPayload);
     payload = undefined;
 

package/src/spyne/views/view-stream-selector.js

@@ -33,7 +33,7 @@ function testSelectors(cxt, str, verboseBool) {
   const elIsDomElement = compose(lte(0), defaultTo(-1),
       prop('nodeType'));
 
-  if (elIsDomElement(el) === false) {
+  if (el !== null && elIsDomElement(el) === false) {
     console.warn(`Spyne Warning: the el object is not a valid single element, ${el}`);
     return;
   }
@@ -52,18 +52,37 @@ function testSelectors(cxt, str, verboseBool) {
 
 function getNodeListArray(cxt, str, verboseBool=false) {
   let selector = str !== undefined ? `${cxt} ${str}` : cxt;
+  let isParent = false;
 
 
   const returnSelectorIfValid = (selector) => {
-        try { document.querySelectorAll(selector) } catch (e) { return [] }
-        return  document.querySelectorAll(selector);
+        let arr = [];
+        try {
+          arr = document.querySelectorAll(selector)
+        } catch (e) { arr = [] }
+        try {
+          isParent = document.querySelector(str) === document.querySelector(cxt);
+          if (isParent === true){
+            arr =  [document.querySelector(str)];
+          }
+        } catch(e){
+          //return [];
+        }
+        return  arr;// document.querySelectorAll(selector);
       };
 
 
+  const elArr =  returnSelectorIfValid(selector);
+
   if (verboseBool===true) {
-    testSelectors(cxt, str, verboseBool);
+    const mainSel = isParent === true ? 'body' : cxt;
+    testSelectors(mainSel, str, verboseBool);
   }
-  return returnSelectorIfValid(selector)
+
+  return elArr;
+
+
+
 }
 
 function setInlineCss(val, cxt, str) {

package/src/spyne/views/view-stream.js

@@ -1,6 +1,7 @@
 import { baseCoreMixins } from '../utils/mixins/base-core-mixins';
 import {SpyneAppProperties} from '../utils/spyne-app-properties';
 import { deepMerge } from '../utils/deep-merge';
+import {safeClone} from '../utils/safe-clone';
 import {
   findStrOrRegexMatchStr,
   getConstructorName
@@ -445,10 +446,11 @@ export class ViewStream {
     const elIsRendered = el => document.body.contains(el);
     const elIsReadyBool = propSatisfies(
         allPass([elIsRendered, elIsDomElement]), 'el');
-
     if (elIsReadyBool(this.props)) {
       this.updatePropsToMatchEl();
       this.postRender();
+    } else if(this.props.el === null){
+      console.error(`Spyne Error: The defined element for this ViewStream instance, ${this.constructor.name}, appears to not exist.`)
     }
   }
 
@@ -890,6 +892,13 @@ export class ViewStream {
     this.renderViewAndAttachToDom(node, 'dom', 'appendChild');
   }
 
+  appendToDomAfter(node){
+    if (this.props.el !== undefined){
+      console.warn(`Spyne Warning: The ViewStream, ${this.props.name}, has an element, ${this.props.el}, that is already rendered and does not need to be appendedToDomAfter. This may create unsusual side effects!`)
+    }
+    this.renderViewAndAttachToDom(node, 'dom', 'after');
+  }
+
   /**
    * Prepends the current ViewStream object to an existing dom element.
    * @param {HTMLElement} node the ViewStream child that is to be attached.
@@ -931,6 +940,10 @@ export class ViewStream {
     this.exchangeViewsWithChild(v, this.setAttachData('appendChild', query));
   }
 
+  appendViewAfter(v, query) {
+    this.exchangeViewsWithChild(v, this.setAttachData('after', query));
+  }
+
   /**
    * This method appends a child ViewStream object to a parent ViewStream object.
    * @param {ViewStream} v the ViewStream parent.
@@ -1286,7 +1299,7 @@ export class ViewStream {
       if (/CHANNEL_LIFECYCLE/.test(action)===false){
         Object.defineProperties(data, {
           payload: {
-            get: ()=> clone(pl)
+            get: ()=> safeClone(pl)
 
           }
         })

package/src/tests/channels/channel.test.js

@@ -31,8 +31,14 @@ describe('should test channel instance', () => {
     expect(props.sendCachedPayload).to.be.true;
     expect(actionsObj).to.deep.equal(finalActionsObj);
 
+  })
 
-
+  it('should update SpyneAppProperties doNotTrackList if doNotTrack is true', ()=>{
+    const channelName="CHANNEL_MY_TEST_CHANNEL";
+    const doNotTrack = true;
+    Channel.checkForNotTrackFlag({channelName, doNotTrack});
+    const untrackedChannelsArr = SpyneAppProperties.getUntrackedChannelsList()
+    expect(untrackedChannelsArr).to.deep.eq([channelName]);
   })
 
 });

package/src/tests/channels/route-utils.test.js

@@ -64,6 +64,7 @@ describe('it should compare two objects for updated keys', () => {
 
   it('first comparison should be done against empty obj', () => {
     let compareStart = checkUpdatedKeys.compare(obj1);
+    console.log("compare start is ",compareStart);
     expect(compareStart.pathsChanged).to.deep.equal(['pageId', 'section']);
   });
 

package/src/tests/utils/channel-data-packet-generator.unused.js

@@ -39,7 +39,7 @@ describe('should test the ChannelDataPacketGenerator', () => {
     map.set(label, ChannelPayloadToTestFilters);
 
     const filterGateway = ChannelDataPacketGenerator.createFilterGateway(label, map);
-    const pred = R.propEq('action', 'CHANNEL_ROUTE_CHANGE_EVENT');
+    const pred = R.propEq('CHANNEL_ROUTE_CHANGE_EVENT', 'action');
 
     const isCorrectAction = filterGateway(pred)
 

package/src/tests/views/dom-el-template.test.js

@@ -31,7 +31,7 @@ describe('DomElTemplate', () => {
     let data = {dog: {
         sound: 'woof'
       }};
-    let template = "<h1>The dog says {{#dog}}{{sound}}{{/dog}}";
+    let template = "<h1>The dog says {{#dog}}{{sound}}{{/dog}}</h1>";
     let domElTemplate = new DomElementTemplate(template, data);
     let render = domElTemplate.renderDocFrag();
     expect(render.firstElementChild.innerText).to.equal('The dog says woof');
@@ -163,6 +163,23 @@ describe('DomElTemplate', () => {
     return true;
   });
 
+  it('DomElementTemplate should render index string value of an array',() =>{
+    const article = ["Usu at illum porro audire. Nam at ubique latine, vidit ocurreret pri ea, cu elitr nonumes mediocritatem nam.",
+      "Eu delenit meliore graecis sea. Sit id ubique commune, ius ne recusabo oportere similique, error putant usu ei.",
+      "Nam mutat saperet detracto eu, te ubique utamur aliquando pro. Ut verear probatus sea. Porro sonet euripidis ex est.",
+      "Mucius platonem eu per. Te utroque persecuti pro, error verterem scribentur no est.",
+      "An pro nibh salutatus, ea rebum aeterno complectitur has."];
+
+    const template = `<li>{{article.1}}</li>`;
+    const data = {article};
+    const domElTemplate = new DomElementTemplate(template, data);
+
+    const result = domElTemplate.renderToString();
+
+    expect(result).to.eq("<li>Eu delenit meliore graecis sea. Sit id ubique commune, ius ne recusabo oportere similique, error putant usu ei.</li>");
+
+  })
+
 
 
 });