Only style <a> with a href link (darkreader#9843)

- This patch changes the behavior of the user agent styling for the `<a>` element. It will only modify the color of `<a>` if it has a link(thus a `href` attribute), this will leave alone those without any link, thus a more user-agent styling matching behavior.
- Resolves darkreader#9836

CHANGELOG.md

@@ -1,3 +1,7 @@
+## Unreleased
+
+- Don't style `<a>` elements without a link(href attribute) anymore. Only those with a link.
+
 ## 4.9.57 (Aug 23, 2022)
 
 - Fix iframes not getting modified when settings were changed.

src/inject/dynamic-theme/modify-css.ts

@@ -112,7 +112,7 @@ export function getModifiedUserAgentStyle(theme: Theme, isIFrame: boolean, style
     lines.push(`    border-color: ${modifyBorderColor({r: 76, g: 76, b: 76}, theme)};`);
     lines.push(`    color: ${modifyForegroundColor({r: 0, g: 0, b: 0}, theme)};`);
     lines.push('}');
-    lines.push('a {');
+    lines.push('a:any-link {');
     lines.push(`    color: ${modifyForegroundColor({r: 0, g: 64, b: 255}, theme)};`);
     lines.push('}');
     lines.push('table {');

tests/inject/dynamic/style-override.tests.ts

@@ -50,13 +50,15 @@ describe('STYLE ELEMENTS', () => {
     it('should override User Agent style', async () => {
         container.innerHTML = multiline(
             '<span>Text</span>',
-            '<a href="#">Link</a>',
+            '<a href="#" class="href">Link</a>',
+            '<a class="non-href">Non-link</a>'
         );
         createOrUpdateDynamicTheme(theme, null, false);
         expect(getComputedStyle(container).backgroundColor).toBe('rgb(0, 0, 0)');
         expect(getComputedStyle(container).color).toBe('rgb(255, 255, 255)');
         expect(getComputedStyle(container.querySelector('span')).color).toBe('rgb(255, 255, 255)');
-        expect(getComputedStyle(container.querySelector('a')).color).toBe('rgb(51, 145, 255)');
+        expect(getComputedStyle(container.querySelector('.href')).color).toBe('rgb(51, 145, 255)');
+        expect(getComputedStyle(container.querySelector('.non-href')).color).toBe('rgb(255, 255, 255)');
     });
 
     it('should override static style', async () => {