DOM Mutation Observer API in Add-on SDK

[arky]

Hi List,

I have a new question about DOM Mutation Observer API in firefox [1].
Using this code in add-on SDK throws the following error. Others seems
to have similar problems [2].

/* Error:

Timestamp: 06/10/2013 10:55:24 PM
Error: twitter_autorefresh: An exception occurred.
TypeError: Value not an object.
resource://jid1-3p6zub9u2yiojg-at-jetpack/twitter_autorefresh/data/refresh.js
23
Traceback (most recent call last):
File
"resource://jid1-3p6zub9u2yiojg-at-jetpack/twitter_autorefresh/data/refresh.js",
line 23, in
observer.observe(target, config);

*/



// select the target node
var target = document.querySelector('.new-tweets-bar');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true }

// pass in the target node, as well as the observer options
observer.observe(target, config);

// later, you can stop observing
observer.disconnect();


Cheers

--arky


[1]https://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/
[2]
http://stackoverflow.com/questions/16581967/jquery-detect-element-injection

[David Bruant]

Hi arky,

Le 12/06/2013 12:12, arky a �crit :

> Hi List,
>
> I have a new question about DOM Mutation Observer API in firefox [1].
> Using this code in add-on SDK throws the following error. Others seems
> to have similar problems [2].
>
> /* Error:

> (...)

> */
>
> // select the target node
> var target = document.querySelector('.new-tweets-bar');

If this ends up being null, the error thrown can find its explanation.
Are you guaranteed that there is always such a element at time of call?

If yes, can you provide an example of the bug with both HTML and JS. It
might just be a Firefox bug that would be worth reporting on Bugzilla
(and may not be related to Jetpack at all especially given the
stackoverflow question).
You can post the 2 files as a gist https://gist.github.com/

David

[arky]

On 06/12/2013 08:59 PM, David Bruant wrote:
>> // select the target node
>> var target = document.querySelector('.new-tweets-bar');
> If this ends up being null, the error thrown can find its explanation.
> Are you guaranteed that there is always such a element at time of call?

Thanks for catching that David. The target node does not exist.

Trying to do click event when .new-tweets-bar node is inserted[1]. Yet
to learn how to watch for such events using DOM Mutation Observer API.


Cheers

--arky
[1] Trying to update the old code
https://github.com/arky/autorefresh-twitter-addon/blob/master/data/refresh.js

[Julien Wajsberg]

I don't know what your DOM looks like, but maybe you want "subtree: true" in your options ?


--
You received this message because you are subscribed to the Google Groups "mozilla-labs-jetpack" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mozilla-labs-jetpack+unsub...@googlegroups.com.
To post to this group, send email to mozilla-labs-jetpack@googlegroups.com.
Visit this group at http://groups.google.com/group/mozilla-labs-jetpack?hl=en-US.
For more options, visit https://groups.google.com/groups/opt_out.

[arky]

On 06/13/2013 01:58 PM, Julien Wajsberg wrote:
> I don't know what your DOM looks like, but maybe you want "subtree:
> true" in your options ?|
> |
>

Here is my DOM https://twitter.com/search?q=%23fail

Cheers

--arky