~evanj/wigly

8cd3e9c46f6d09efc27ed669f435fd5879f97718 — Evan M Jones 2 years ago 6519d8f
fixing remover superfine func being called twice on immediate children on removal
4 files changed, 43 insertions(+), 15 deletions(-)

M package-lock.json
M package.json
M src/wigly.js
M test/main.js
M package-lock.json => package-lock.json +1 -1
@@ 1,6 1,6 @@
{
  "name": "wigly",
  "version": "0.3.3",
  "version": "0.3.4",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {

M package.json => package.json +1 -1
@@ 1,6 1,6 @@
{
  "name": "wigly",
  "version": "0.3.4",
  "version": "0.3.5",
  "main": "dist/wigly.es5.js",
  "scripts": {
    "example": "parcel example/index.html",

M src/wigly.js => src/wigly.js +17 -12
@@ 106,9 106,18 @@ let wigly = {
      let lc = ["oncreate", "onupdate", "onremove", "ondestroy"].reduce(
        (fns, key) => ({
          ...fns,
          [key]: (...args) => {
            res.props.oncreate && res.props[key](...args);
            lifecycles[key](...args);
          [key]: (el, maybeRemove) => {
            let remover = typeof maybeRemove === "function" ? maybeRemove : NOOP;
            node = el;

            if (res.props[key]) {
              res.props[key](el);
              lifecycles[key](el);
              remover();
            } else {
              lifecycles[key](el);
              remover();
            }
          }
        }),
        {}


@@ 118,31 127,27 @@ let wigly = {
      return { ...res, props: { ...res.props, ...lc } };
    };

    /** @type {InternalLifecycle} */
    let lifecycles = {
      oncreate: el => {
        node = el;
      oncreate: () => {
        isActive = true;
        save();
        callEffects();
      },

      onupdate: el => {
        node = el;
      onupdate: () => {
        isActive = true;
        save();
        nexttick(callEffects);
      },

      onremove: (el, remove) => {
        node = el;
      onremove: () => {
        isActive = false;
        save();
        update();
        remove();
      },

      ondestroy: el => {
        node = el;
      ondestroy: () => {
        isActive = false;
        originalParentCallback(env(), true); // remove records from parent
      }

M test/main.js => test/main.js +24 -1
@@ 28,7 28,6 @@ test("Conditional components work as expected.", t => {
  t.deepEqual(element.textContent, "hi");

  element.querySelector("button").click();

  t.deepEqual(element.textContent, "");
});



@@ 56,3 55,27 @@ test("Immediate component children lifecycles.", t => {
  t.deepEqual(parentMounted, true);
  t.deepEqual(childMounted, true);
});

test("Immediate components are removed properly.", t => {
  let setter;

  function ChildOne() {
    return <div>here we go</div>;
  }

  function ChildTwo() {
    return <ChildOne />;
  }

  function Parent() {
    let [active, set] = useState(true);
    setter = set;
    return <div>{active && <ChildTwo />}</div>;
  }

  var { element } = render(<Parent />, document.body);
  t.deepEqual(element.textContent, "here we go");

  setter(false);
  t.deepEqual(element.textContent, "");
});