Repository: darkreader/darkreader (ts)

Issue:
[BUG] protected pages cannot be disabled when granted permission
### **Describe the bug**

 If a protected page is allowed to be modified by darkreader, that page cannot be toggled

### **Expected behavior**

If you grant permission for darkreader to work on protected pages, the dark mode should be able to be toggled just like another website.

### **Screenshots**

Dark mode cannot be disabled on addons.mozilla.org (recommendation of Dark Reader is by pure chance):
![image](https://user-images.githubusercontent.com/5833034/91642584-344f4d00-ea35-11ea-871a-5e65b55e03ff.png)
I tried screenshotting the settings window but it disappears when I capture the picture.

### **System Information:**
 - OS: Ubuntu 20.04
 - Browser: Firefox 81 beta
 - Dark Reader version: GitHub development snapshot mentioned on #3533



Pull request description:
Fix render bug for protected sites
- tab.isProtected should not use `enableForProtectedPages` option as it doesn't get up-to-date data and will return the old value.
- Real-time site-toggle disable according isProtected logic and `enableForProtectedPages` option.
- Make test according to the good visa-versa logic(Forgot to update in previous PR)
- Resolves #3548

Patch:
diff --git a/src/background/extension.ts b/src/background/extension.ts
index db636704..8eae5d16 100644
--- a/src/background/extension.ts
+++ b/src/background/extension.ts
@@ -364,7 +364,7 @@ export class Extension {
     private getURLInfo(url: string): TabInfo {
         const {DARK_SITES} = this.config;
         const isInDarkList = isURLInList(url, DARK_SITES);
-        const isProtected = !(this.user.settings.enableForProtectedPages || canInjectScript(url));
+        const isProtected = !canInjectScript(url);
         return {
             url,
             isInDarkList,
diff --git a/src/config/dynamic-theme-fixes.config b/src/config/dynamic-theme-fixes.config
index dada08f9..247b211e 100644
--- a/src/config/dynamic-theme-fixes.config
+++ b/src/config/dynamic-theme-fixes.config
@@ -899,6 +899,13 @@ CSS
 
 ================================
 
+chess.com
+
+IGNORE IMAGE ANALYSIS
+.piece
+
+================================
+
 chilkatsoft.com
 
 CSS
@@ -2010,6 +2017,9 @@ div.drm-container svg g
 
 fandom.com
 
+INVERT
+.wds-global-navigation__logo-fandom
+
 IGNORE INLINE STYLE
 .wds-global-navigation__logo-image g path
 .wds-global-footer__header-logo g path
@@ -2100,6 +2110,15 @@ img[src$="assets/images/bg-cloud.png"]
 
 ================================
 
+filmweb.pl
+
+CSS
+.filmInfo__info {
+    color: var(--darkreader-neutral-text) !important;
+}
+
+================================
+
 filterlists.com
 
 IGNORE INLINE STYLE
@@ -3181,6 +3200,11 @@ INVERT
 .CodeMirror-cursor
 .user-story-chapter-base .companies-showcase-base .logo
 
+CSS
+[class^=question-picker-detail] {
+    background: none !important;
+}
+
 ================================
 
 lenovo.com
@@ -4288,6 +4312,13 @@ div[dir="ltr", id="map"] {
 
 ================================
 
+openwall.com
+
+INVERT
+.logo
+
+================================
+
 overleaf.com
 
 INVERT
@@ -4872,6 +4903,13 @@ svg.server-pro-logo
 
 ================================
 
+servercat.net
+
+INVERT
+.theme-header-logo
+
+================================
+
 share.dmhy.org
 
 CSS
@@ -5449,6 +5487,7 @@ theguardian.com
 
 INVERT
 .inline-the-guardian-logo__svg
+a[data-link-name$="logo"] > svg
 
 ================================
 
@@ -7008,6 +7047,15 @@ CSS
 
 ================================
 
+zdic.net
+
+CSS
+.zisong img {
+    background-color: ${black} !important;
+}
+
+================================
+
 zeptovm.com
 
 INVERT
diff --git a/src/ui/controls/shortcut/index.tsx b/src/ui/controls/shortcut/index.tsx
index 27ca0b8c..c00474c2 100644
--- a/src/ui/controls/shortcut/index.tsx
+++ b/src/ui/controls/shortcut/index.tsx
@@ -1,6 +1,6 @@
 import {m} from 'malevic';
 import {mergeClass} from '../utils';
-import {isFirefox} from '../../../utils/platform';
+import {isFirefox, isEdge} from '../../../utils/platform';
 import {Shortcuts} from '../../../definitions';
 
 interface ShortcutLinkProps {
@@ -83,6 +83,13 @@ export default function ShortcutLink(props: ShortcutLinkProps) {
             startEnteringShortcut(e.target as HTMLAnchorElement);
             return;
         }
+        if (isEdge()) {
+            chrome.tabs.create({
+                url: `edge://extensions/shortcuts`,
+                active: true
+            });
+            return;
+        }
         chrome.tabs.create({
             url: `chrome://extensions/configureCommands#command-${chrome.runtime.id}-${props.commandName}`,
             active: true
diff --git a/src/ui/icons.less b/src/ui/icons.less
index 1c5e39ef..7faabb22 100644
--- a/src/ui/icons.less
+++ b/src/ui/icons.less
@@ -1,6 +1,8 @@
+@icon-escaped-color: escape(@color-control-fore-inactive);
 @icon-check: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="white" d="M0,4 l2,2 l5,-5 v1.5 l-5,5 l-2,-2 z"/></svg>');
-@icon-cross-escaped-color: escape(@color-control-fore-inactive);
-@icon-cross: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="@{icon-cross-escaped-color}" d="M1,0.5 l6,6 v1.5 l-6,-6 Z M1,6.5 l6,-6 v1.5 l-6,6 z"/></svg>');
+@icon-close: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="none" stroke="white" stroke-width="1" d="M1,1 l6,6 M1,7 l6,-6"/></svg>');
+@icon-close-inactive: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="none" stroke="@{icon-escaped-color}" stroke-width="1" d="M1,1 l6,6 M1,7 l6,-6"/></svg>');
+@icon-cross: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="@{icon-escaped-color}" d="M1,0.5 l6,6 v1.5 l-6,-6 Z M1,6.5 l6,-6 v1.5 l-6,6 z"/></svg>');
 @icon-down: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="white" d="M1,2 l3,3 l3,-3 v1.5 l-3,3 l-3,-3 z"/></svg>');
 @icon-left: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="white" d="M6,1 h-1.5 l-3,3 l3,3 h1.5 l-3,-3 z"/></svg>');
 @icon-list: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 8"><path fill="white" d="M0,0 h1 v1 h-1 z m2,0 h6 v1 h-6 z m-2,3.25 h1 v1 h-1 z m2,0 h6 v1 h-6 z m-2,3.25 h1 v1 h-1 z m2,0 h6 v1 h-6 z"/></svg>');
diff --git a/src/ui/popup/components/site-toggle/index.tsx b/src/ui/popup/components/site-toggle/index.tsx
index 23d423dc..247207a3 100644
--- a/src/ui/popup/components/site-toggle/index.tsx
+++ b/src/ui/popup/components/site-toggle/index.tsx
@@ -14,7 +14,7 @@ export default function SiteToggleButton({data, tab, actions}: ExtWrapper & {tab
         }
     }
     const toggleHasEffect = (
-        data.isEnabled &&
+        data.settings.enableForProtectedPages || 
         !tab.isProtected
     );
     const pdf = isPDF(tab.url);
diff --git a/src/ui/popup/site-list-page/site-list.tsx b/src/ui/popup/site-list-page/site-list.tsx
index bf1a10b1..a4987168 100644
--- a/src/ui/popup/site-list-page/site-list.tsx
+++ b/src/ui/popup/site-list-page/site-list.tsx
@@ -55,6 +55,15 @@ export default function SiteList(props: SiteListProps) {
         props.onChange(values);
     }
 
+    function removeValue(event: MouseEvent) {
+        const previousSibling = ((event.target as HTMLInputElement).previousSibling as HTMLInputElement);
+        const index = store.indices.get(previousSibling);
+        const filtered = props.siteList.slice();
+        filtered.splice(index, 1);
+        store.shouldFocusAtIndex = index;
+        props.onChange(filtered);
+    }
+
     function createTextBox(text: string, index: number) {
         const onRender = (node: HTMLInputElement) => {
             store.indices.set(node, index);
@@ -64,12 +73,19 @@ export default function SiteList(props: SiteListProps) {
             }
         };
         return (
-            <TextBox
-                class="site-list__textbox"
-                value={text}
-                onrender={onRender}
-                placeholder="google.com/maps"
-            />
+            <div class="site-list__item">
+                <TextBox
+                    class="site-list__textbox"
+                    value={text}
+                    onrender={onRender}
+                    placeholder="google.com/maps"
+                />
+                <span
+                    class="site-list__item__remove"
+                    role="button"
+                    onclick={removeValue}
+                />
+            </div>
         );
     }
 
diff --git a/src/ui/popup/site-list-page/style.less b/src/ui/popup/site-list-page/style.less
index 606d48c5..8d7cdd4e 100644
--- a/src/ui/popup/site-list-page/style.less
+++ b/src/ui/popup/site-list-page/style.less
@@ -1,4 +1,5 @@
 @import "../../theme.less";
+@import "../../icons.less";
 
 .site-list-page {
     align-items: center;
@@ -45,4 +46,33 @@
             z-index: 1;
         }
     }
+
+    &__item {
+        position: relative;
+
+        &__remove {
+            background-color: transparent;
+            background-image: @icon-close-inactive;
+            background-position: center;
+            background-repeat: no-repeat;
+            background-size: 0.75rem;
+            border-radius: 50%;
+            cursor: pointer;
+            display: none;
+            height: 1.25rem;
+            position: absolute;
+            right: 0.125rem;
+            top: 0.125rem;
+            width: 1.25rem;
+
+            &:hover {
+                background-color: @color-control-active;
+                background-image: @icon-close;
+            }
+        }
+
+        &:hover .site-list__item__remove {
+            display: inline-block;
+        }
+    }
 }
diff --git a/src/utils/url.ts b/src/utils/url.ts
index 7470ce7d..3ffc5fb9 100644
--- a/src/utils/url.ts
+++ b/src/utils/url.ts
@@ -137,7 +137,7 @@ export function isPDF(url: string) {
 }
 
 export function isURLEnabled(url: string, userSettings: UserSettings, {isProtected, isInDarkList}) {
-    if (isProtected && userSettings.enableForProtectedPages) {
+    if (isProtected && !userSettings.enableForProtectedPages) {
         return false;
     }
     if (isPDF(url) && userSettings.enableForPDF) {


Test patch:
diff --git a/tests/utils/url.tests.ts b/tests/utils/url.tests.ts
index 743b107f..7ab7a334 100644
--- a/tests/utils/url.tests.ts
+++ b/tests/utils/url.tests.ts
@@ -66,12 +66,12 @@ test('URL is enabled', () => {
         'https://chrome.google.com/webstore',
         {siteList: ['chrome.google.com'], siteListEnabled: [], applyToListedOnly: true, enableForProtectedPages: true} as UserSettings,
         {isProtected: true, isInDarkList: false},
-    )).toBe(false);
+    )).toBe(true);
     expect(isURLEnabled(
         'https://chrome.google.com/webstore',
         {siteList: [], siteListEnabled: [], applyToListedOnly: false, enableForProtectedPages: false} as UserSettings,
         {isProtected: true, isInDarkList: false},
-    )).toBe(true);
+    )).toBe(false);
     expect(isURLEnabled(
         'https://chrome.google.com/webstore',
         {siteList: ['chrome.google.com'], siteListEnabled: [], applyToListedOnly: false, enableForProtectedPages: true} as UserSettings,
@@ -86,7 +86,7 @@ test('URL is enabled', () => {
         'https://microsoftedge.microsoft.com/addons',
         {siteList: ['microsoftedge.microsoft.com'], siteListEnabled: [], applyToListedOnly: true, enableForProtectedPages: true} as UserSettings,
         {isProtected: true, isInDarkList: false},
-    )).toBe(false);
+    )).toBe(true);
     expect(isURLEnabled(
         'https://duckduckgo.com',
         {siteList: [], siteListEnabled: [], applyToListedOnly: false, enableForProtectedPages: true} as UserSettings,