Famous / Famous/engine

DOMElement lifecycle issues

Open
#245 11 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
JavaScript
Stars
1.7k
Forks
249
PR merge metrics
No merged PRs in 30d

Description

1. Repurposing a DOMElement leaves existing/previous classes/attributes/properties intact, e.g:

![x](https://cloud.githubusercontent.com/assets/381978/8021273/a307505a-0c99-11e5-8215-f38d96f5c7cd.gif)

or as a pseudo-test (can I submit PRs just for tests? :))

``` js
var FamousEngine = require('famous/core/FamousEngine');
var DOMElement = require('famous/dom-renderables/DOMElement');

var scene = FamousEngine.createScene('body');
var clock = FamousEngine.getClock();
FamousEngine.init();

var node1 = scene.addChild();
var domElement1 = new DOMElement(node1);
domElement1.addClass('myClass');

clock.setTimeout(function() {
// node1.removeComponent(domElement1);
scene.removeChild(node1);

var node2 = scene.addChild();
var domElement2 = new DOMElement(node2);
clock.setTimeout(function () {
// fail/false in 0.5.2 -> 0.7, pass with PR#266
console.log('test pass:',
!document.querySelector('[data-fa-path="body/0"]')
.className.match(/\bmyClass\b/));
}, 17);
}, 17);
```

Note: unnoticeable without the setTimeout.
2. **Fixed in 0.6.** ~~In `DOMElement.onDismount`, we recycle the element by (amongst other things), setting `display: none` and leaving it attached to the DOM. But the plane is still visible on WebGL animations:~~

![x](https://cloud.githubusercontent.com/assets/381978/8021242/5ea1a9fc-0c98-11e5-89a5-35937daf1b0f.gif)

~~at least in Chrome stable 43 and beta 44. cc: @trusktr. Confirming that `display: none` is set (you can see the contents and background color all disappear)~~.
3. Should `node.removeComponent(domElement)` do any of the stuff that `DOMElement.onDismount` does? i.e. recycle the domElement.

What is the expected behaviour if we call removeComponent with and/or without removing the node too?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.