Skip to content

Vs/refactor reader v 1 #832

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.

Sign up for GitHub

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

Merged
merged 2 commits into from
Oct 9, 2025
Merged

Vs/refactor reader v 1 #832

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
77e20f6
vs/ReaderView1
vsangereanMOZ Oct 9, 2025
69f84bf
vs/ReaderView1
vsangereanMOZ Oct 9, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
243 changes: 100 additions & 143 deletions tests/reader_view/test_improved_type_control_panel.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
import pytest
from typing import Literal

from selenium.webdriver import Firefox

from modules.browser_object import ReaderView
Expand All @@ -8,247 +10,202 @@


@pytest.fixture()
def test_case():
def test_case() -> str:
return "130919"


size_controllers = ["minus", "plus"]
themes = [
("light", "rgb(255, 255, 255)"),
("dark", "rgb(28, 27, 34)"),
("sepia", "rgb(244, 236, 216)"),
("contrast", "rgb(0, 0, 0)"),
("gray", "rgb(215, 215, 219)"),
]
fonts = ["sans-serif", "serif", "monospace"]
alignments = [("left", "start"), ("right", "right"), ("center", "center")]
slider_options = ["decrease", "increase"]


READER_VIEW_URL = (
# Constants / parametrization
READER_VIEW_URL: str = (
"https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-web-pages"
)

SizeControl = Literal["minus", "plus"]
AlignKey = Literal["left", "right", "center"]
AlignCSS = Literal["start", "right", "center"]
SliderDirection = Literal["decrease", "increase"]

SIZE_CONTROLS: list[SizeControl] = ["minus", "plus"]
FONTS: list[Literal["sans-serif", "serif", "monospace"]] = ["sans-serif", "serif", "monospace"]
ALIGNMENTS: list[tuple[AlignKey, AlignCSS]] = [("left", "start"), ("right", "right"), ("center", "center")]
SLIDER_DIRS: list[SliderDirection] = ["decrease", "increase"]


def prep_test(web_page: GenericPage, reader_view: ReaderView) -> None:
# Helpers
def _open_reader_type_panel(web_page: GenericPage, reader_view: ReaderView) -> None:
"""
Open the target page, enter Reader View, and open the 'Type' panel.
"""
web_page.open()
reader_view.open_reader_view_searchbar()
reader_view.click_toolbar_option("toolbar-type")


def _css_int(util: Utilities, element, prop: str) -> int:
"""
Read a CSS property and normalize it to an integer by stripping non-numeric chars.
"""
return int(util.remove_all_non_numbers(element.value_of_css_property(prop)))


@pytest.mark.ci
@pytest.mark.parametrize("font", fonts)
def test_type_control_panel_font(driver: Firefox, font: str):
@pytest.mark.parametrize("font", FONTS)
def test_type_control_panel_font(driver: Firefox, font: Literal["sans-serif", "serif", "monospace"]) -> None:
"""
C130919.1: Ensure the functionality of the type control panels works
C130919.1: Ensure the functionality of the type control panels works (font family).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)

body = web_page.get_element("page-body")

reader_view.wait.until(
lambda _: "sans-serif" in body.value_of_css_property("font-family")
)
# Ensure default is sans-serif first so the next wait has a stable baseline
reader_view.wait.until(lambda _: "sans-serif" in body.value_of_css_property("font-family"))

font_dropdown_root = reader_view.get_element("toolbar-font-selector")
font_dropdown = Dropdown(
page=reader_view, require_shadow=False, root=font_dropdown_root
)
font_dropdown = Dropdown(page=reader_view, require_shadow=False, root=font_dropdown_root)
font_dropdown.select_option(
f"about-reader-font-type-{font}", option_tag="option", label_name="data-l10n-id"
f"about-reader-font-type-{font}",
option_tag="option",
label_name="data-l10n-id",
)

reader_view.wait.until(lambda _: font in body.value_of_css_property("font-family"))


@pytest.mark.parametrize("type", size_controllers)
def test_type_control_panel_size(driver: Firefox, type: str):
@pytest.mark.parametrize("control", SIZE_CONTROLS)
def test_type_control_panel_size(driver: Firefox, control: SizeControl) -> None:
"""
C130919.2: Ensure the functionality of the type control panels works
C130919.2: Ensure the functionality of the type control panels works (text size).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)
util = Utilities()

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)

body = web_page.get_element("page-body")
font_before = int(
util.remove_all_non_numbers(body.value_of_css_property("--font-size"))
)
reader_view.get_element(f"toolbar-textsize-{type}").click()
if type == "minus":
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(body.value_of_css_property("--font-size"))
)
< font_before
)
size_before = _css_int(util, body, "--font-size")

reader_view.get_element(f"toolbar-textsize-{control}").click()

if control == "minus":
reader_view.wait.until(lambda _: _css_int(util, body, "--font-size") < size_before)
else:
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(body.value_of_css_property("--font-size"))
)
> font_before
)
reader_view.wait.until(lambda _: _css_int(util, body, "--font-size") > size_before)


@pytest.mark.parametrize("alignment, intended_alignment", alignments)
@pytest.mark.parametrize("alignment,intended_alignment", ALIGNMENTS)
def test_type_control_panel_text_alignment(
driver: Firefox, alignment: str, intended_alignment: str
):
driver: Firefox,
alignment: AlignKey,
intended_alignment: AlignCSS,
) -> None:
"""
C130919.3: Ensure the functionality of the type control panels works
C130919.3: Ensure the functionality of the type control panels works (text alignment).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)

container = web_page.get_element("container-div")
reader_view.open_advanced_options()

reader_view.get_element(f"toolbar-text-align-{alignment}").click()
reader_view.wait.until(
lambda _: container.value_of_css_property("--text-alignment")
== intended_alignment
)
reader_view.wait.until(lambda _: container.value_of_css_property("--text-alignment") == intended_alignment)


@pytest.mark.parametrize("width", slider_options)
def test_type_control_panel_content_width(driver: Firefox, width: str):
@pytest.mark.parametrize("direction", SLIDER_DIRS)
def test_type_control_panel_content_width(driver: Firefox, direction: SliderDirection) -> None:
"""
C130919.4: Ensure the functionality of the type control panels works
C130919.4: Ensure the functionality of the type control panels works (content width slider).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)
util = Utilities()

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)

reader_view.change_slider_element_shadow_parent("toolbar-content-width")

body = web_page.get_element("page-body")
before_content_width = int(
util.remove_all_non_numbers(body.value_of_css_property("--content-width"))
)
content_width_slider = reader_view.get_element("slider")

if width == "decrease":
reader_view.change_slider_value(content_width_slider, increase=False)
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(
body.value_of_css_property("--content-width")
)
)
< before_content_width
)
width_before = _css_int(util, body, "--content-width")
slider = reader_view.get_element("slider")

reader_view.change_slider_value(slider, increase=(direction == "increase"))

if direction == "decrease":
reader_view.wait.until(lambda _: _css_int(util, body, "--content-width") < width_before)
else:
reader_view.change_slider_value(content_width_slider)
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(
body.value_of_css_property("--content-width")
)
)
> before_content_width
)
reader_view.wait.until(lambda _: _css_int(util, body, "--content-width") > width_before)


@pytest.mark.parametrize("line_height", slider_options)
def test_type_control_panel_line_spacing(driver: Firefox, line_height: str):
@pytest.mark.parametrize("direction", SLIDER_DIRS)
def test_type_control_panel_line_spacing(driver: Firefox, direction: SliderDirection) -> None:
"""
C130919.5: Ensure the functionality of the type control panels works
C130919.5: Ensure the functionality of the type control panels works (line spacing slider).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)
util = Utilities()

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)

reader_view.change_slider_element_shadow_parent("toolbar-line-spacing")

body = web_page.get_element("page-body")
before_block_size = int(
util.remove_all_non_numbers(body.value_of_css_property("block-size"))
)
content_line_spacer_slider = reader_view.get_element("slider")

if line_height == "decrease":
reader_view.change_slider_value(content_line_spacer_slider, increase=False)
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(body.value_of_css_property("block-size"))
)
< before_block_size
)
block_before = _css_int(util, body, "block-size")
slider = reader_view.get_element("slider")

reader_view.change_slider_value(slider, increase=(direction == "increase"))

if direction == "decrease":
reader_view.wait.until(lambda _: _css_int(util, body, "block-size") < block_before)
else:
reader_view.change_slider_value(content_line_spacer_slider)
reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(body.value_of_css_property("block-size"))
)
> before_block_size
)
reader_view.wait.until(lambda _: _css_int(util, body, "block-size") > block_before)


def test_type_control_panel_character_spacing(driver: Firefox):
def test_type_control_panel_character_spacing(driver: Firefox) -> None:
"""
C130919.6: Ensure the functionality of the type control panels works
C130919.6: Ensure the functionality of the type control panels works (character spacing slider).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)
util = Utilities()

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)
reader_view.open_advanced_options()

reader_view.change_slider_element_shadow_parent("toolbar-character-spacing")

container = web_page.get_element("container-div")
before_character_spacing = int(
util.remove_all_non_numbers(container.value_of_css_property("--letter-spacing"))
)
content_character_spacing_slider = reader_view.get_element("slider")
reader_view.change_slider_value(content_character_spacing_slider)

reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(
container.value_of_css_property("--letter-spacing")
)
)
> before_character_spacing
)
letter_before = _css_int(util, container, "--letter-spacing")
slider = reader_view.get_element("slider")

reader_view.change_slider_value(slider, increase=True)

reader_view.wait.until(lambda _: _css_int(util, container, "--letter-spacing") > letter_before)


def test_type_control_panel_word_spacing(driver: Firefox):
def test_type_control_panel_word_spacing(driver: Firefox) -> None:
"""
C130919.7: Ensure the functionality of the type control panels works
C130919.7: Ensure the functionality of the type control panels works (word spacing slider).
"""
web_page = GenericPage(driver, url=READER_VIEW_URL)
reader_view = ReaderView(driver)
util = Utilities()

prep_test(web_page, reader_view)
_open_reader_type_panel(web_page, reader_view)
reader_view.open_advanced_options()

reader_view.change_slider_element_shadow_parent("toolbar-word-spacing")

container = web_page.get_element("container-div")
before_word_spacing = int(
util.remove_all_non_numbers(container.value_of_css_property("--word-spacing"))
)
content_word_spacing_slider = reader_view.get_element("slider")
reader_view.change_slider_value(content_word_spacing_slider)

reader_view.wait.until(
lambda _: int(
util.remove_all_non_numbers(
container.value_of_css_property("--word-spacing")
)
)
> before_word_spacing
)
word_before = _css_int(util, container, "--word-spacing")
slider = reader_view.get_element("slider")

reader_view.change_slider_value(slider, increase=True)

reader_view.wait.until(lambda _: _css_int(util, container, "--word-spacing") > word_before)