mirror of https://github.com/gorhill/uBlock.git
improve DOM inspector (#3254)
* dom-inspector: Improvments - Fix race between userCSS injection and element highlight resulting in none or not all elements highlighted. - Fix page being scanned twice resulting in unneeded slowdown. * dom-inspector: Clear mutationTimer to allow more than one update. * dom-inspector: Fix procedural filters shown as declarative with expando.
This commit is contained in:
parent
1f7243ce55
commit
ec70c75264
|
@ -774,7 +774,7 @@ vAPI.messaging.onPortMessage = (function() {
|
|||
return new CallbackWrapper(port, request);
|
||||
};
|
||||
|
||||
var toFramework = function(request, port) {
|
||||
var toFramework = function(request, port, callback) {
|
||||
var sender = port && port.sender;
|
||||
if ( !sender ) { return; }
|
||||
var tabId = sender.tab && sender.tab.id;
|
||||
|
@ -826,13 +826,19 @@ vAPI.messaging.onPortMessage = (function() {
|
|||
details.runAt = 'document_start';
|
||||
}
|
||||
var cssText;
|
||||
const cssPromises = [];
|
||||
for ( cssText of msg.add ) {
|
||||
details.code = cssText;
|
||||
chrome.tabs.insertCSS(tabId, details);
|
||||
cssPromises.push(chrome.tabs.insertCSS(tabId, details));
|
||||
}
|
||||
for ( cssText of msg.remove ) {
|
||||
details.code = cssText;
|
||||
chrome.tabs.removeCSS(tabId, details);
|
||||
cssPromises.push(chrome.tabs.removeCSS(tabId, details));
|
||||
}
|
||||
if ( typeof callback === 'function' ) {
|
||||
Promise.all(cssPromises).then(() => {
|
||||
callback();
|
||||
}, null);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
@ -851,19 +857,18 @@ vAPI.messaging.onPortMessage = (function() {
|
|||
});
|
||||
|
||||
return function(request, port) {
|
||||
// Content process to main process: framework handler.
|
||||
// No callback supported/needed for now.
|
||||
if ( request.channelName === 'vapi' ) {
|
||||
toFramework(request, port);
|
||||
return;
|
||||
}
|
||||
|
||||
// Auxiliary process to main process: prepare response
|
||||
// prepare response
|
||||
var callback = this.NOOPFUNC;
|
||||
if ( request.auxProcessId !== undefined ) {
|
||||
callback = callbackWrapperFactory(port, request).callback;
|
||||
}
|
||||
|
||||
// Content process to main process: framework handler.
|
||||
if ( request.channelName === 'vapi' ) {
|
||||
toFramework(request, port, callback);
|
||||
return;
|
||||
}
|
||||
|
||||
// Auxiliary process to main process: specific handler
|
||||
var r = this.UNHANDLED,
|
||||
listener = this.listeners[request.channelName];
|
||||
|
|
|
@ -451,7 +451,7 @@ vAPI.DOMFilterer.prototype = {
|
|||
this.hiddenNodesetToProcess.add(node);
|
||||
},
|
||||
|
||||
toggle: function(state) {
|
||||
toggle: function(state, callback) {
|
||||
vAPI.userStylesheet.toggle(state);
|
||||
var disabled = vAPI.userStylesheet.disabled,
|
||||
nodes = document.querySelectorAll('[' + this.hideNodeAttr + ']');
|
||||
|
@ -465,6 +465,9 @@ vAPI.DOMFilterer.prototype = {
|
|||
if ( disabled === false && this.hideNodeExpando !== undefined ) {
|
||||
this.hideNodeBatchProcessTimer.start();
|
||||
}
|
||||
if ( typeof callback === 'function' ) {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
|
||||
getAllSelectors_: function(all) {
|
||||
|
|
|
@ -31,13 +31,13 @@ if ( typeof vAPI === 'object' ) { // >>>>>>>> start of HUGE-IF-BLOCK
|
|||
vAPI.userStylesheet = {
|
||||
added: new Set(),
|
||||
removed: new Set(),
|
||||
apply: function() {
|
||||
apply: function(callback) {
|
||||
if ( this.added.size === 0 && this.removed.size === 0 ) { return; }
|
||||
vAPI.messaging.send('vapi', {
|
||||
what: 'userCSS',
|
||||
add: Array.from(this.added),
|
||||
remove: Array.from(this.removed)
|
||||
});
|
||||
}, callback);
|
||||
this.added.clear();
|
||||
this.removed.clear();
|
||||
},
|
||||
|
@ -184,7 +184,7 @@ vAPI.DOMFilterer.prototype = {
|
|||
node.removeAttribute(this.hideNodeAttr);
|
||||
},
|
||||
|
||||
toggle: function(state) {
|
||||
toggle: function(state, callback) {
|
||||
if ( state === undefined ) { state = this.disabled; }
|
||||
if ( state !== this.disabled ) { return; }
|
||||
this.disabled = !state;
|
||||
|
@ -197,7 +197,7 @@ vAPI.DOMFilterer.prototype = {
|
|||
userStylesheet.add(rule);
|
||||
}
|
||||
}
|
||||
userStylesheet.apply();
|
||||
userStylesheet.apply(callback);
|
||||
},
|
||||
|
||||
getAllSelectors_: function(all) {
|
||||
|
|
|
@ -363,6 +363,7 @@ var domLayout = (function() {
|
|||
|
||||
var journalFromMutations = function() {
|
||||
var nodelist, node, domNode, nid;
|
||||
mutationTimer = undefined;
|
||||
|
||||
// This is used to temporarily hold all added nodes, before resolving
|
||||
// their node id and relative position.
|
||||
|
@ -537,9 +538,8 @@ var cosmeticFilterMapper = (function() {
|
|||
for ( entry of (details.procedural || []) ) {
|
||||
nodes = entry.exec();
|
||||
for ( node of nodes ) {
|
||||
if ( filterMap.has(node) === false ) {
|
||||
filterMap.set(node, entry.raw);
|
||||
}
|
||||
// Upgrade declarative selector to procedural one
|
||||
filterMap.set(node, entry.raw);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -800,8 +800,7 @@ var start = function() {
|
|||
document.removeEventListener(ev.type, onReady);
|
||||
}
|
||||
vAPI.messaging.sendTo(loggerConnectionId, domLayout.get());
|
||||
vAPI.domFilterer.toggle(false);
|
||||
highlightElements();
|
||||
vAPI.domFilterer.toggle(false, highlightElements);
|
||||
};
|
||||
if ( document.readyState === 'loading' ) {
|
||||
document.addEventListener('DOMContentLoaded', onReady);
|
||||
|
@ -951,9 +950,6 @@ var bootstrap = function(ev) {
|
|||
|
||||
window.addEventListener('scroll', onScrolled, true);
|
||||
|
||||
cosmeticFilterMapper.reset();
|
||||
highlightElements();
|
||||
|
||||
vAPI.messaging.connectTo('domInspector', 'loggerUI', messagingHandler);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue