Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

move brave://adblock/ to brave://settings/shields #8838

Closed
3 tasks done
rebron opened this issue Mar 24, 2020 · 13 comments · Fixed by brave/brave-core#12827
Closed
3 tasks done

move brave://adblock/ to brave://settings/shields #8838

rebron opened this issue Mar 24, 2020 · 13 comments · Fixed by brave/brave-core#12827
Assignees
Labels

Comments

@rebron
Copy link
Collaborator

rebron commented Mar 24, 2020

Description

Move brave://adblock/ to brave://settings/shields/content-filters

  • New design for Ad Block page in brave://settings/shields/content-filters
  • Add Content Filtering section in brave://settings/shields
  • Add a link to brave://adblock in the Shields panel

Designs

Screen Shot 2022-05-27 at 9 24 16 AM

remaining screens in Figma

Settings page/shields section and filters page:
https://www.figma.com/file/tLXWGCpNoiJxDZDdpfordj/Desktop-Settings?node-id=1636%3A30096

@rebron rebron added feature/shields The overall Shields feature in Brave. feature/shields/adblock Blocking ads & trackers with Shields feature/settings labels Mar 24, 2020
@karenkliu
Copy link

@tomlowenthal Can you help fill out some content on the new adblock page?

  • Regional and specific filters now have a one-line description underneath
  • Custom Filters now have a one-line description underneath
  • Each filter now has a one-line description of what they are best used for underneath

@tildelowengrimm
Copy link
Contributor

tildelowengrimm commented Mar 25, 2020

  • Regional and specific filters: "These filters block regional and language-specific trackers and annoyances."
  • Custom filters: "Get technical by adding your own specific filters. Make sure to use Adblock Plus syntax." where "Ablock Plus syntax" links to https://adblockplus.org/filter-cheatsheet (unless we want to duplicate that page in our own documentation site, cc @Brave-Matt ).

@cezaraugusto cezaraugusto self-assigned this Apr 6, 2020
@Brave-Matt
Copy link

@tomlowenthal,
I'd love to make a nicely formatted copy of this cheat sheet on our Help Center. I feel like we should be linking to our own sources as much as possible (even if "our source" is just a reformatting of something that already exists).

Will write up a draft and share here if interested 👍

@rebron rebron added priority/P3 The next thing for us to work on. It'll ride the trains. OS/Desktop labels May 8, 2020
@cezaraugusto cezaraugusto removed their assignment May 18, 2020
@rebron
Copy link
Collaborator Author

rebron commented May 29, 2020

@karenkliu Can you update the design section as it relates to #9975 I think #9975 has the more recent work.

@rebron rebron removed their assignment May 29, 2020
@karenkliu
Copy link

@rebron Yep, thanks for catching that. Updated!

@rebron rebron assigned simonhong and unassigned karenkliu Jun 16, 2020
@rebron
Copy link
Collaborator Author

rebron commented Jun 16, 2020

cc: @pes10k

@karenkliu
Copy link

Designs updated due to #8107

@srirambv srirambv changed the title move brave://adblock/ to brave://settings/shields [Desktop] move brave://adblock/ to brave://settings/shields Sep 9, 2020
@Furax-31
Copy link

Hello, is the new interface for Brave Shield going to be on the Nightly version soon?

@bsclifton
Copy link
Member

@Furax-31 while we have some designs, no work has started yet

@aguscruiz
Copy link

@MadhaviSeelam
Copy link

MadhaviSeelam commented Jun 9, 2022

Verification PASSED using

Brave 1.41.62 Chromium: 103.0.5060.42 (Official Build) nightly (64-bit)
Revision de0d840bf9439c31bd86bf74f065c31fdf9b208d-refs/branch-heads/5060@{#667}
OS Windows 11 Version 21H2 (Build 22000.675)

Case 1:brave://adblock redirect to brave://settings/shields/content-filters - PASSED

  1. Install 1.41.62
  2. Launch brave
  3. Load brave://adblock
  4. Confirmed the redirect to brave://settings/shields/content-filters
Dark Light
image image

Case 2:brave://adblock redirect to brave://settings/shields/content-filters from Shields Panel - PASSED

  1. Launch brave
  2. Load brave.com
  3. Click to open Shield panel
  4. Click Filter lists
  5. Confirmed the redirect to new Content Filtering page brave://settings/shields/content-filters
Filter_lists content_filter
image image

Case 3: brave://adblock redirect to brave://settings/shields/content-filters from context menu - PASSED

  1. Load brave.com
  2. right click on the page to open context menu (Brave > Manage custom filters)
  3. Select Manage custom filters
  4. Confirmed the redirect to brave://settings/shields/content-filters in a new tab (or an existing one is present)
Step 2 Step 4
image image

Case 4: Content Filtering section in brave://settings/shields - PASSED

  1. Launch brave
  2. Load brave://settings/shields
  3. Verified Content Filtering section is displayed
  4. Content Filtering text/sub text match to Figma design
  5. Click Content Filtering section
  6. brave://settings/shields/content-filters page should load in the same tab.
  7. Click back arrow next to Content filters on top of the page to return to brave://settings/shields
  8. Confirmed returned to brave://settings/shields page
Step 3 Step 7
Step 3 <Step 7

New Adblock page functionality

Case 5: Content Filtering Functionality in brave://settings/shields/content-filters - PASSED

  1. Launch brave
  2. Load brave://settings/shields/content-filters
  3. Content filters page is loaded successfully
  4. Click Show List to expand the lists in the Content filtering
  5. Refresh the page to collapse
  6. Search for EasyList Dutch
  7. EasyList Dutch filter should be displayed
  8. Select it and refresh the page to see the selection is persisted
  9. Uncheck to disable the filter.
  10. Search with a keyword Easy
  11. Confirmed filtered list is displayed
Step 3& 4 Step 5 Step 6&7 Step 8 Step 11
Step 3&4 Step 5 Step 6&7 Step8 Step 11

Case 6: Add custom filter lists functionality - PASSED

  1. Load brave://settings/shields/content-filters
  2. Content filters page should be loaded
  3. Navigate to Add custom filter lists section
  4. Enter the URL in the input field https://raw.githubusercontent.com/DandelionSprout/adfilt/master/Anti-'Custom%20cursors'%20List.txt
  5. Click Add button
  6. URL is added to Custom lists
  7. It should display Last updated time when added
  8. Click on ellipsis (3 dots) menu
  9. click Update now to see the change
  10. Click View Source
  11. The list opens in a new tab
  12. Click Unsubscribe
  13. Entry should be removed
  14. Add one more URL https://raw.githubusercontent.com/reek/anti-adblock-killer/master/anti-adblock-killer-filters.txt
  15. Confirmed URL is displayed in the Custom filter list
Step6 Step8 Step9 Step10 Step11 Step12 Step 13
Step 6 Step 8 Step9 Step 9 image image image

Case 7: Custom Filters - Verify blocked page elements are added to the Custom Filters section and removing unblocks it - PASSED

  1. New Profile
  2. Load nytimes.com
  3. right click on the page to open context menu
  4. Select Block element and click create
  5. Select Manage custom filters to redirect brave://settings/shields/content-filters in NTP
  6. Custom Filters field displayed blocked page elements
  7. Delete the blocked page elements from the field and click Save changes
  8. Return to the website and reload the page
  9. Confirmed the page elements reloaded
Step4 Step5 Step6 Step8
Step3 Step4 Step 5 Step 7

Case 8: Metadata from filter list subscriptions should be available in brave://settings/shields/content-filters - PASSED

This was tested as part of #17910

  1. Launch brave
  2. Visit https://filterlists.com
  3. Click filter icon on the Syntaxes column to select Adblock Plus lists.
  4. Click on the blue (i) icon for AakList (Anti-Adblock Killer)
  5. Click View button in the info panel to the right.
  6. Page opens in a new tab and note down the Title or Homepage:
  7. Title: AakList (Anti-Adblock Killer)
  8. Homepage: https://github.com/reek/anti-adblock-killer/
  9. Copy the URL https://raw.githubusercontent.com/reek/anti-adblock-killer/master/anti-adblock-killer-filters.txt
  10. Visit brave://settings/shields/content-filters
  11. Paste above URL in the Add custom filter lists input field
  12. Click Add button
  13. A new list subscription is created and URL is added to Custom lists area and shows Last Updated time
  14. Visit brave://local-state
  15. Search for AakList (Anti-Adblock Killer)
  16. Confirmed the new subscription is listed and the list matches to entry from https://filterlists.com
Step2 Step4 Step6 Step13 Step16
Step2 Step4 Step6 Step13 Step16

Case 9: Regression: Verify Easylist-Cookie List - Filter Obtrusive Cookie Notices filter list works as expected - PASSED

  1. Visit https://digikey.com and confirm that a cookie notice is shown. It will appear either as a banner at the top, or as a popup along the bottom depending on window size.
  2. Visit brave://settings/shields/content-filters and manually toggle the Easylist-Cookie List - Filter Obtrusive Cookie Notices entry to be enabled
  3. Visit https://digikey.com and refresh page
  4. Confirm that no cookie notice is shown.
  5. Return to brave://settings/shields/content-filters and uncheck Easylist-Cookie List - Filter Obtrusive Cookie Notices
  6. Return to https://digikey.com and reload the site
  7. Confirmed that the cookie notice is shown again.
Step2 Step3 Step4 Step6 Step9
Step2 Step3 <Step4 Step6 Step2

@stephendonner
Copy link

stephendonner commented Jun 14, 2022

Verification PASSED using

Brave 1.41.62 Chromium: 103.0.5060.42 (Official Build) nightly (x86_64)
Revision de0d840bf9439c31bd86bf74f065c31fdf9b208d-refs/branch-heads/5060@{#667}
OS macOS Version 12.5 (Build 21G5037d)

Case 1:brave://adblock redirects to brave://settings/shields/filters - PASSED

  1. Install 1.41.62
  2. Launch brave
  3. Load brave://adblock
  4. Confirmed the redirect to brave://settings/shields/filters
Dark Light
Screen Shot 2022-06-14 at 3 07 55 PM Screen Shot 2022-06-14 at 3 07 42 PM

Case 2:brave://adblock redirect to brave://settings/shields/filters from Shields Panel - PASSED

  1. Launch Brave
  2. Load brave.com
  3. Click to open Shields panel
  4. Click Filter lists
  5. Confirmed redirect to brave://settings/shields/filters
Content Filtering filters
Screen Shot 2022-06-14 at 3 10 03 PM Screen Shot 2022-06-14 at 3 10 09 PM

Case 3: brave://adblock redirect to brave://settings/shields/filters from context menu - PASSED

  1. load brave.com
  2. right click on the page to open context menu (Brave > Manage custom filters)
  3. select Manage custom filters
  4. confirmed the redirect to brave://settings/shields/filters in a new tab (or an existing one is present)
Step 2 Step 4
Screen Shot 2022-06-14 at 3 16 02 PM Screen Shot 2022-06-14 at 3 16 28 PM

Case 4: Add Content Filtering section in brave://settings/shields - PASSED

  1. Launch Brave
  2. Load brave://settings/shields
  3. Verified Content Filtering section is displayed
  4. Content Filtering text/sub text match to (updated) Figma design
  5. Click Content Filtering section
  6. brave://settings/shields/content-filters page should load in the same tab.
  7. Click back arrow next to Content filters on top of the page to return to brave://settings/shields
Step 3 Step 7
Screen Shot 2022-06-14 at 3 42 21 PM Screen Shot 2022-06-14 at 3 42 26 PM

New Adblock page functionality

Case 5: Content Filtering Functionality in brave://settings/shields/filters - PASSED

  1. Launch Brave
  2. Load brave://settings/shields/filters
  3. Content filters page is loaded successfully
  4. Click Show List to expand the lists in the Content filtering
  5. Refresh the page to collapse
  6. Search for EasyList Dutch
  7. EasyList Dutch filter should be displayed
  8. Select it and refresh the page to see the selection is persisted
  9. Uncheck to disable the filter.
  10. Search with a keyword Easy and confirmed filtered list displayed
Step 3 & 4 Step 5 Step 6&7 Step 8 Step 10
Screen Shot 2022-06-14 at 3 53 20 PM Screen Shot 2022-06-14 at 3 53 14 PM Screen Shot 2022-06-14 at 3 53 41 PM Screen Shot 2022-06-14 at 4 03 28 PM Screen Shot 2022-06-14 at 4 08 39 PM

Case 6: Add custom filter lists functionality - PASSED

  1. Load brave://settings/shields/filters
  2. Content filters page should be loaded
  3. Navigate to Add custom filter lists section
  4. Enter the URL in the input field https://raw.githubusercontent.com/DandelionSprout/adfilt/master/Anti-'Custom%20cursors'%20List.txt
  5. Click Add button
  6. URL is added to Custom lists
  7. It should display Last updated time when added
  8. Click on ellipsis (3 dots) menu
  9. click Update now to see the change
  10. Click View Source
  11. The list opens in a new tab
  12. Click Unsubscribe
  13. Entry should be removed
  14. Add one more URL https://raw.githubusercontent.com/reek/anti-adblock-killer/master/anti-adblock-killer-filters.txt
  15. URL is displayed in the Custom filter list
Step 6 Step 8 Step 9 Step 10 Step 11 Step 12 Step 13 Step 15
Screen Shot 2022-06-14 at 4 18 41 PM Screen Shot 2022-06-14 at 4 19 37 PM Screen Shot 2022-06-14 at 4 19 46 PM Screen Shot 2022-06-14 at 4 22 09 PM Screen Shot 2022-06-14 at 4 22 12 PM Screen Shot 2022-06-14 at 4 22 25 PM Screen Shot 2022-06-14 at 4 22 27 PM Screen Shot 2022-06-14 at 4 23 19 PM

Case 7: Custom Filters - Verify blocked page elements are added to the Custom Filters section and removing unblocks it - PASSED

  1. Load nytimes.com
  2. Right-click on the page to open context menu
  3. Select Block element and click Create
  4. Select Manage custom filters to redirect brave://settings/shields/filters in NTP
  5. Custom Filters field displayed page elements
  6. Delete the page elements from the field and click Save changes
  7. Return to the website
  8. Reload the page
Step 3 Step 4 Step 5 Step 7 Step 8
Screen Shot 2022-06-14 at 4 50 34 PM Screen Shot 2022-06-14 at 4 33 02 PM Screen Shot 2022-06-14 at 4 52 07 PM Screen Shot 2022-06-14 at 4 51 53 PM Screen Shot 2022-06-14 at 5 06 15 PM

Case 8: Metadata from filter list subscriptions should be available in brave://settings/shields/content-filters - PASSED

This was tested as part of #17910: #17910 (comment)

Case 9: Regression: Verify Easylist-Cookie List - Filter Obtrusive Cookie Notices filter list works as expected - PASSED

  1. Visit https://digikey.com and confirm that a cookie notice is shown. It will appear either as a banner at the top, or as a popup along the bottom depending on window size.
  2. Visit brave://settings/shields/content-filters and manually toggle the Easylist-Cookie List - Filter Obtrusive Cookie Notices entry to be enabled
  3. Visit https://digikey.com and refresh page
  4. Confirm that no cookie notice is shown.
  5. Return to brave://settings/shields/content-filters and uncheck Easylist-Cookie List - Filter Obtrusive Cookie Notices
  6. Return to https://digikey.com and reload the site
  7. Confirmed that the cookie notice is shown again.
Step 1 Step 2 Step 4 Step 5 Step 7
Screen Shot 2022-06-15 at 2 37 43 PM Screen Shot 2022-06-15 at 2 38 34 PM Screen Shot 2022-06-15 at 2 38 47 PM Screen Shot 2022-06-15 at 2 38 56 PM Screen Shot 2022-06-15 at 2 39 11 PM

@stephendonner
Copy link

stephendonner commented Jun 28, 2022

Verification PASSED using

Brave 1.41.82 Chromium: 103.0.5060.66 (Official Build) beta (64-bit)
Revision 20b1569438a85e631d15e83eb355e3e326e5da6f-refs/branch-heads/5060@{#1066}
OS Linux

Case 1:brave://adblock redirects to brave://settings/shields/filters - PASSED

  1. Install 1.41.82
  2. Launch brave
  3. Load brave://adblock
  4. Confirmed the redirect to brave://settings/shields/filters
Dark Light
Screen Shot 2022-06-28 at 2 22 10 PM Screen Shot 2022-06-28 at 2 22 03 PM

Case 2:brave://adblock redirects to brave://settings/shields/filters from Shields Panel - PASSED

  1. Launch Brave
  2. Load brave.com
  3. Click to open Shields panel
  4. Click Filter lists
  5. Confirmed redirect to brave://settings/shields/filters
Filter lists brave://settings/shields/filters
Screen Shot 2022-06-28 at 2 37 02 PM Screen Shot 2022-06-28 at 2 37 06 PM

Case 3: brave://adblock redirects to brave://settings/shields/filters from context menu - PASSED

  1. load brave.com
  2. right click on the page to open context menu (Brave > Manage custom filters)
  3. select Manage custom filters
  4. confirmed the redirect to brave://settings/shields/filters in a new tab (or an existing one is present)
Step 2 Step 4
Screen Shot 2022-06-28 at 2 39 52 PM Screen Shot 2022-06-28 at 2 40 00 PM

Case 4: Add Content Filtering section in brave://settings/shields - PASSED

  1. Launch Brave
  2. Load brave://settings/shields
  3. Verified Content Filtering section is displayed
  4. Content Filtering text/sub text match to (updated) Figma design
  5. Click Content Filtering section
  6. brave://settings/shields/content-filters page should load in the same tab.
  7. Click back arrow next to Content filters on top of the page to return to brave://settings/shields
Step 3 Step 7
Screen Shot 2022-06-28 at 2 47 24 PM Screen Shot 2022-06-28 at 2 47 27 PM

New Adblock page functionality

Case 5: Content Filtering Functionality in brave://settings/shields/filters - PASSED

  1. Launch Brave
  2. Load brave://settings/shields/filters
  3. Content filters page is loaded successfully
  4. Click Show List to expand the lists in the Content filtering
  5. Refresh the page to collapse
  6. Search for EasyList Dutch
  7. EasyList Dutch filter should be displayed
  8. Select it and refresh the page to see the selection is persisted
  9. Uncheck to disable the filter.
  10. Search with a keyword Easy and confirmed filtered list displayed
Step 3 & 4 Step 5 Step 6&7 Step 8 Step 10
Screen Shot 2022-06-28 at 2 52 05 PM Screen Shot 2022-06-28 at 2 55 40 PM Screen Shot 2022-06-28 at 2 56 04 PM Screen Shot 2022-06-28 at 2 56 32 PM Screen Shot 2022-06-28 at 2 57 08 PM

Case 6: Add custom filter lists functionality - PASSED

  1. Load brave://settings/shields/filters
  2. Content filters page should be loaded
  3. Navigate to Add custom filter lists section
  4. Enter the URL in the input field https://raw.githubusercontent.com/DandelionSprout/adfilt/master/Anti-'Custom%20cursors'%20List.txt
  5. Click Add button
  6. URL is added to Custom lists
  7. It should display Last updated time when added
  8. Click on ellipsis (3 dots) menu
  9. click Update now to see the change
  10. Click View Source
  11. The list opens in a new tab
  12. Click Unsubscribe
  13. Entry should be removed
  14. Add one more URL https://raw.githubusercontent.com/reek/anti-adblock-killer/master/anti-adblock-killer-filters.txt
  15. URL is displayed in the Custom filter list
Step 6 Step 8 Step 9 Step 10 Step 11 Step 12 Step 13 Step 15
Screen Shot 2022-06-28 at 3 21 15 PM Screen Shot 2022-06-28 at 3 21 28 PM Screen Shot 2022-06-28 at 3 22 02 PM Screen Shot 2022-06-28 at 3 28 29 PM Screen Shot 2022-06-28 at 3 22 15 PM Screen Shot 2022-06-28 at 3 22 31 PM Screen Shot 2022-06-28 at 3 23 39 PM Screen Shot 2022-06-28 at 3 24 01 PM

Case 7: Custom Filters - Verify blocked page elements are added to the Custom Filters section and removing unblocks it - PASSED

  1. Load nytimes.com
  2. Right-click on the page to open context menu
  3. Select Block element and click Create
  4. Select Manage custom filters to redirect brave://settings/shields/filters in NTP
  5. Custom Filters field displayed page elements
  6. Delete the page elements from the field and click Save changes
  7. Return to the website
  8. Reload the page
Step 3 Step 4 Step 5 Step 7 Step 8
Screen Shot 2022-06-28 at 3 33 32 PM Screen Shot 2022-06-28 at 3 33 42 PM Screen Shot 2022-06-28 at 3 33 58 PM Screen Shot 2022-06-28 at 3 34 23 PM Screen Shot 2022-06-28 at 3 34 30 PM

Case 8: Metadata from filter list subscriptions should be available in brave://settings/shields/content-filters - PASSED

This was tested as part of #17910.

Case 9: Regression: Verify Easylist-Cookie List - Filter Obtrusive Cookie Notices filter list works as expected - PASSED

  1. Visit https://digikey.com and confirm that a cookie notice is shown. It will appear either as a banner at the top, or as a popup along the bottom depending on window size.
  2. Visit brave://settings/shields/content-filters and manually toggle the Easylist-Cookie List - Filter Obtrusive Cookie Notices entry to be enabled
  3. Visit https://digikey.com and refresh page
  4. Confirm that no cookie notice is shown.
  5. Return to brave://settings/shields/content-filters and uncheck Easylist-Cookie List - Filter Obtrusive Cookie Notices
  6. Return to https://digikey.com and reload the site
  7. Confirmed that the cookie notice is shown again.
Step 1 Step 2 Step 4 Step 5 Step 7
Screen Shot 2022-06-28 at 3 40 17 PM Screen Shot 2022-06-28 at 3 40 11 PM Screen Shot 2022-06-28 at 3 40 29 PM Screen Shot 2022-06-28 at 3 41 06 PM Screen Shot 2022-06-28 at 3 41 16 PM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.