From 1408422cbaa8d1efc0832b6cf09595fcc20369d7 Mon Sep 17 00:00:00 2001 From: Raymond Hill Date: Sat, 27 Nov 2021 11:58:32 -0500 Subject: [PATCH] Fine tune new reporting feature Add ability to bring back logger button in popup panel through the advanced setting `uiPopupConfig`. Adding `+logger` token to `uiPopupConfig` will bring back the logger icon in the mobile version of the popup panel. Additionally, the link to the logger in the Support pane will take into account whether the key is pressed, so as to behave like the logger icon in the popup panel. Related issue: - https://github.com/uBlockOrigin/uBlock-issues/issues/1847 The troubleshooting information has been further fine-tuned to report popup panel data related to the reported page, for better diagnosis by disclosing any customization to uBO which was affecting the reported page. --- src/css/popup-fenix.css | 7 +++- src/css/support.css | 13 +++--- src/js/messaging.js | 3 +- src/js/popup-fenix.js | 18 +++++++++ src/js/support.js | 89 +++++++++++++++++------------------------ src/support.html | 26 +++++------- 6 files changed, 79 insertions(+), 77 deletions(-) diff --git a/src/css/popup-fenix.css b/src/css/popup-fenix.css index fa8c722b5..40922807f 100644 --- a/src/css/popup-fenix.css +++ b/src/css/popup-fenix.css @@ -580,9 +580,14 @@ body.godMode #actionSelector > #dynaAllow { :root body[data-ui~="+no-popups"] #no-popups { display: flex; } -:root.mobile [href="logger-ui.html#_"] { +:root.mobile [href="logger-ui.html#_"], +:root body[data-ui~="-logger"] [href="logger-ui.html#_"] { display: none; } +:root:not(.mobile) [href="logger-ui.html#_"], +:root body[data-ui~="+logger"] [href="logger-ui.html#_"] { + display: flex; + } body:not([data-more~="a"]) [data-more="a"], body:not([data-more~="b"]) [data-more="b"], body:not([data-more~="c"]) [data-more="c"], diff --git a/src/css/support.css b/src/css/support.css index 9b97493e4..35af8d676 100644 --- a/src/css/support.css +++ b/src/css/support.css @@ -5,10 +5,11 @@ body { .body > div { max-width: 800px; } - +h3 { + margin-bottom: 0; + } .supportEntry { display: flex; - margin-top: 1em; } :root.mobile .supportEntry { flex-direction: column; @@ -16,13 +17,16 @@ body { .supportEntry > div:first-of-type { flex-grow: 1; } +:root:not(.mobile) .supportEntry > div:first-of-type { + margin-inline-end: 2em; + } .supportEntry > div.hasButtons { align-items: center; display: flex; justify-content: space-around; } .supportEntry h3 { - margin-top: 0; + margin: 1em 0; } .e > .supportEntry { @@ -45,8 +49,7 @@ body.filterIssue .body > div:not(.e) { } button { - margin-inline-end: 1em; - -webkit-margin-end: 1em; + align-self: center; } span[data-url] { color: var(--link-ink); diff --git a/src/js/messaging.js b/src/js/messaging.js index 2006e1b2a..a85d77ca8 100644 --- a/src/js/messaging.js +++ b/src/js/messaging.js @@ -490,7 +490,8 @@ const onMessage = function(request, sender, callback) { const pageStore = µb.pageStoreFromTabId(request.tabId); if ( pageStore === null ) { break; } const supportURL = new URL(vAPI.getURL('support.html')); - supportURL.searchParams.set('reportURL', pageStore.rawURL); + supportURL.searchParams.set('pageURL', request.pageURL); + supportURL.searchParams.set('popupPanel', request.popupPanel); µb.openNewTab({ url: supportURL.href, select: true, index: -1 }); break; } diff --git a/src/js/popup-fenix.js b/src/js/popup-fenix.js index 8799070ff..3982f4d4f 100644 --- a/src/js/popup-fenix.js +++ b/src/js/popup-fenix.js @@ -840,9 +840,27 @@ const gotoPick = function() { /******************************************************************************/ const gotoReport = function() { + const popupPanel = { + blocked: popupData.pageCounts.blocked.any, + }; + const reportedStates = [ + { name: 'enabled', prop: 'netFilteringSwitch', expected: true }, + { name: 'no-cosmetic-filtering', prop: 'noCosmeticFiltering', expected: false }, + { name: 'no-large-media', prop: 'noLargeMedia', expected: false }, + { name: 'no-popups', prop: 'noPopups', expected: false }, + { name: 'no-remote-fonts', prop: 'noRemoteFonts', expected: false }, + { name: 'no-scripting', prop: 'noScripting', expected: false }, + { name: 'can-element-picker', prop: 'canElementPicker', expected: true }, + ]; + for ( const { name, prop, expected } of reportedStates ) { + if ( popupData[prop] === expected ) { continue; } + popupPanel[name] = !expected; + } messaging.send('popupPanel', { what: 'launchReporter', tabId: popupData.tabId, + pageURL: popupData.pageURL, + popupPanel: JSON.stringify(popupPanel), }); vAPI.closePopup(); diff --git a/src/js/support.js b/src/js/support.js index e67ea1032..7880dfc11 100644 --- a/src/js/support.js +++ b/src/js/support.js @@ -29,6 +29,8 @@ let supportData; const uselessKeys = [ 'modifiedHiddenSettings.benchmarkDatasetURL', + 'modifiedHiddenSettings.consoleLogLevel', + 'modifiedHiddenSettings.uiPopupConfig', 'modifiedUserSettings.alwaysDetachLogger', 'modifiedUserSettings.popupPanelSections', 'modifiedUserSettings.externalLists', @@ -133,32 +135,6 @@ function showData() { const shownData = JSON.parse(JSON.stringify(supportData)); uselessKeys.forEach(prop => { removeKey(shownData, prop); }); const redacted = true; - // If the report is for a specific site, report per-site switches which - // are triggered on the reported site. - if ( - reportHostname !== '' && - shownData.switchRuleset instanceof Object && - Array.isArray(shownData.switchRuleset.added) - ) { - const added = []; - const triggered = []; - for ( const rule of shownData.switchRuleset.added ) { - const match = /^[^:]+:\s+(\S+)/.exec(rule); - if ( - match[1] === '*' || - reportHostname === match[1] || - reportHostname.endsWith(`.${match[1]}`) - ) { - triggered.push(rule); - } else { - added.push(rule); - } - } - if ( triggered.length !== 0 ) { - shownData.switchRuleset.triggered = triggered; - shownData.switchRuleset.added = added; - } - } if ( redacted ) { sensitiveValues.forEach(prop => { redactValue(shownData, prop); }); sensitiveKeys.forEach(prop => { redactKeys(shownData, prop); }); @@ -166,14 +142,17 @@ function showData() { for ( const prop in shownData ) { patchEmptiness(shownData, prop); } + if ( reportedPage !== null ) { + shownData.popupPanel = reportedPage.popupPanel; + } const text = JSON.stringify(shownData, null, 2) .split('\n') .slice(1, -1) .map(v => { return v - .replace( /^( *?) "/, '$1') - .replace( /^( *.*[^\\])(?:": "|": \{$|": \[$|": )/, '$1: ') - .replace( /(?:",?|\},?|\],?|,)$/, ''); + .replace(/^( *?) "/, '$1') + .replace(/^( *.*[^\\])(?:": "|": \{$|": \[$|": )/, '$1: ') + .replace(/(?:",?|\},?|\],?|,)$/, ''); }) .filter(v => v.trim() !== '') .join('\n') + '\n'; @@ -181,17 +160,18 @@ function showData() { cmEditor.setValue(text); cmEditor.clearHistory(); - addDetailsToReportURL('filterReport', redacted === false); - addDetailsToReportURL('bugReport', redacted === false); + addDetailsToReportURL('filterReport', true); + addDetailsToReportURL('bugReport', true); } /******************************************************************************/ -const reportHostname = (( ) => { +const reportedPage = (( ) => { const url = new URL(window.location.href); try { - const reportURL = url.searchParams.get('reportURL'); - const parsedURL = new URL(reportURL); + const pageURL = url.searchParams.get('pageURL'); + if ( pageURL === null ) { return null; } + const parsedURL = new URL(pageURL); parsedURL.username = ''; parsedURL.password = ''; parsedURL.hash = ''; @@ -209,13 +189,14 @@ const reportHostname = (( ) => { option.textContent = parsedURL.href; select.append(option); } - if ( reportURL !== null ) { - document.body.classList.add('filterIssue'); - } - return parsedURL.hostname.replace(/^www\./, ''); + document.body.classList.add('filterIssue'); + return { + hostname: parsedURL.hostname.replace(/^www\./, ''), + popupPanel: JSON.parse(url.searchParams.get('popupPanel')), + }; } catch(ex) { } - return ''; + return null; })(); function reportSpecificFilterType() { @@ -225,7 +206,7 @@ function reportSpecificFilterType() { function reportSpecificFilterIssue(ev) { const githubURL = new URL('https://github.com/uBlockOrigin/uAssets/issues/new?template=specific_report_from_ubo.yml'); const issueType = reportSpecificFilterType(); - let title = `${reportHostname}: ${issueType}`; + let title = `${reportedPage.hostname}: ${issueType}`; if ( document.getElementById('isNSFW').checked ) { title = `[nsfw] ${title}`; } @@ -269,24 +250,26 @@ uBlockDashboard.patchCodeMirrorEditor(cmEditor); if ( typeof url !== 'string' || url === '' ) { return; } vAPI.messaging.send('default', { what: 'gotoURL', - details: { url, select: true, index: -1 }, + details: { url, select: true, index: -1, shiftKey: ev.shiftKey }, }); ev.preventDefault(); }); - uDom('[data-i18n="supportReportSpecificButton"]').on('click', ev => { - reportSpecificFilterIssue(ev); - }); - - uDom('[data-i18n="supportFindSpecificButton"]').on('click', ev => { - const url = new URL('https://github.com/uBlockOrigin/uAssets/issues'); - url.searchParams.set('q', `is:issue "${reportHostname}" in:title`); - vAPI.messaging.send('default', { - what: 'gotoURL', - details: { url: url.href, select: true, index: -1 }, + if ( reportedPage !== null ) { + uDom('[data-i18n="supportReportSpecificButton"]').on('click', ev => { + reportSpecificFilterIssue(ev); }); - ev.preventDefault(); - }); + + uDom('[data-i18n="supportFindSpecificButton"]').on('click', ev => { + const url = new URL('https://github.com/uBlockOrigin/uAssets/issues'); + url.searchParams.set('q', `is:issue "${reportedPage.hostname}" in:title`); + vAPI.messaging.send('default', { + what: 'gotoURL', + details: { url: url.href, select: true, index: -1 }, + }); + ev.preventDefault(); + }); + } uDom('#selectAllButton').on('click', ( ) => { cmEditor.focus(); diff --git a/src/support.html b/src/support.html index e9c9b40de..c446d5674 100644 --- a/src/support.html +++ b/src/support.html @@ -18,59 +18,51 @@
+

-

-
- -
+
+

-

-
- -
+
+

-

-
- -
+
+

-

-
- -
+
+

-