setMutationHandler

MutationObserver wrapper to wait for the specified CSS selector

< Feedback on setMutationHandler

مراجعة: Good - script works

§
Posted: 27-12-2015
Edited: 27-12-2015

I get "nodes[0] is undefined" in this script (it used to work ok)

Its about this script Rotten Tomatoes Decimal Rating, where you had kindly helped me in here. It used to work great, but now I only get nodes[0] is undefined for lines 8, 14 and 21 in Browser Console (of Firefox 43.0.2 with GM 3.6).

Also, there has been a layout change in rottentomatoes today, so I've changed in lines 9+10 and 16+17 from title into data-original-title (the .audience-info div:first-child' in line 23 remains as is).

The script:

// ==UserScript==
// @name          Rotten Tomatoes Decimal Rating
// @require       https://greasyfork.org/scripts/12228/code/setMutationHandler.js
// @run-at        document-start
// ==/UserScript==

// for mouseover on "TOMATOMETER (?)" 
setMutationHandler(document, 'h3.scoreTitle:nth-child(2) > span:nth-child(1)', function(observer, nodes) {
    nodes[0].setAttribute('data-original-title', 
    nodes[0].getAttribute('data-original-title')+(' (=6 stars or higher)'));
    observer.disconnect();
});

// for mouseover on "AUDIENCE SCORE (?) / WANT TO SEE (?)"
setMutationHandler(document, 'h3.scoreTitle:nth-child(1) > span:nth-child(1)', function(observer, nodes) {
    nodes[0].setAttribute('data-original-title', 
    nodes[0].getAttribute('data-original-title').replace(/([\d.]+)( stars)/, 
            function(m, s1, s2) { return 2 * s1 + s2 }));
    observer.disconnect();    
});

// for "AUDIENCE SCORE Average Rating"
setMutationHandler(document, '.audience-info div:first-child', function(observer, nodes) {
    nodes[0].innerHTML = nodes[0].innerHTML.replace(/[\d.]+/g, function(m) { return 2*m });
    observer.disconnect();
});

Why is this happening?

woxxomمؤلف
§
Posted: 27-12-2015

I've almost immediately switched the order of arguments to nodes, mutationRecord because the observer parameter is rarely used. You can access it as this:

// for mouseover on "TOMATOMETER (?)" 
setMutationHandler(document, 'h3.scoreTitle:nth-child(2) > span:nth-child(1)', function(nodes) {
    nodes[0].setAttribute('data-original-title', 
    nodes[0].getAttribute('data-original-title')+(' (=6 stars or higher)'));
    this.disconnect();
});
// for mouseover on "AUDIENCE SCORE (?) / WANT TO SEE (?)"
setMutationHandler(document, 'h3.scoreTitle:nth-child(1) > span:nth-child(1)', function(nodes) {
    nodes[0].setAttribute('data-original-title', 
    nodes[0].getAttribute('data-original-title').replace(/([\d.]+)( stars)/, 
            function(m, s1, s2) { return 2 * s1 + s2 }));
    this.disconnect();    
});
// for "AUDIENCE SCORE Average Rating"
setMutationHandler(document, '.audience-info div:first-child', function(nodes) {
    nodes[0].innerHTML = nodes[0].innerHTML.replace(/[\d.]+/g, function(m) { return 2*m });
    this.disconnect();
});
§
Posted: 27-12-2015
Edited: 27-12-2015

Thanks. But, I now get nodes[0].getAttribute(...) is null for line 17.

woxxomمؤلف
§
Posted: 27-12-2015

Apparently the site has changed the html layout.

§
Posted: 27-12-2015

But, the selectors are correct. For example in http://www.rottentomatoes.com/m/star_wars/ the

document.querySelector('h3.scoreTitle:nth-child(2) > span:nth-child(1)').getAttribute('data-original-title')

and

document.querySelector('h3.scoreTitle:nth-child(1) > span:nth-child(1)').getAttribute('data-original-title')

show the relevant texts of the two tooltips. Therefore the selectors are not the problem.

woxxomمؤلف
§
Posted: 27-12-2015

The script works here in Chrome 49 and Tampermonkey 3.13

§
Posted: 27-12-2015
Edited: 27-12-2015

The script is supposed to make 3 changes: the two tooltips and the innerHTML on "AUDIENCE SCORE Average Rating".

So, currently the script only works partially, i.e. it makes the 3rd change (the innerHTML), in both FF and Chrome, but not the two tooltips . (I just tried out Chrome 49 and Tampermonkey 3.13).

woxxomمؤلف
§
Posted: 27-12-2015

I don't know what they've changed but here's an optimized script that works properly:

// for "AUDIENCE SCORE Average Rating"
setMutationHandler(document, '.audience-info div:first-child', function(nodes) {
    this.disconnect();
    nodes[0].innerHTML = nodes[0].innerHTML.replace(/[\d.]+/g, function(m) { return 2*m });

    // for mouseover on "TOMATOMETER (?)" 
    document.querySelector('h3.scoreTitle:nth-child(2) > span:nth-child(1)').title += ' (=6 stars or higher)';

    // for mouseover on "AUDIENCE SCORE (?) / WANT TO SEE (?)"
    var node = document.querySelector('h3.scoreTitle:nth-child(1) > span:nth-child(1)');
    node.title = node.title.replace(/([\d.]+)( stars)/, function(m, s1, s2) { return 2 * s1 + s2 });
});
§
Posted: 27-12-2015
Edited: 27-12-2015

Thank you very much. I really appreciate it.

Post reply

تسجيل الدخول إلى مرحلة ما بعد الرد.