Skip to content

Commit

Permalink
MDL-73974 tool_brickfield: Processing alpha fontsizes
Browse files Browse the repository at this point in the history
  • Loading branch information
@learningtechnologyservices
learningtechnologyservices committed Jul 27, 2023
1 parent acf600a commit 70c91a4
Show file tree
Hide file tree
Showing 3 changed files with 159 additions and 3 deletions.
47 changes: 46 additions & 1 deletion .../tool/brickfield/classes/local/htmlchecker/common/brickfield_accessibility_color_test.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,6 +170,19 @@ class brickfield_accessibility_color_test extends brickfield_accessibility_test
'yellowgreen' => '9acd32'
];

/** @var string[] Define estimated relative font-size codes to pt values. */
public $fontsizenames = [
'xx-small' => 9,
'x-small' => 10,
'small' => 11,
'smaller' => 11,
'medium' => 12,
'large' => 14,
'larger' => 14,
'x-large' => 18,
'xx-large' => 24,
];

/**
* Helper method that finds the luminosity between the provided
* foreground and background parameters.
Expand Down Expand Up @@ -227,7 +240,8 @@ public function luminosity(string $r, string $r2, string $g, string $g2, string
$l2 = (.2126 * $r4 + 0.7152 * $g4 + 0.0722 * $b4);
}

$luminosity = round(($l1 + 0.05) / ($l2 + 0.05), 2);
// Increase round to 4 to avoid a 4.49 contrast being round up to a false pass of 4.5.
$luminosity = round(($l1 + 0.05) / ($l2 + 0.05), 4);
return $luminosity;
}

Expand Down Expand Up @@ -362,4 +376,35 @@ public function get_wai_diffs(array $forergb, array $backrgb): array {
: $backrgb['b'] - $forergb['b'];
return ['red' => $reddiff, 'green' => $greendiff, 'blue' => $bluediff];
}

/**
* Helper method that finds the estimated font-size for the provided
* string font-size parameter.
* @param string $fontsize The css font-size, in various formats
* @return int The estimated font-size
*/
public function get_fontsize(string $fontsize): int {
$newfontsize = 12; // Default value, in pt, equivalent to 16px.

// Search for rem, em, and px initially, typical font-size values.
$pos1 = stripos($fontsize, 'rem');
$pos2 = stripos($fontsize, 'em');
$pos3 = stripos($fontsize, 'px');
if ($pos1 !== false) {
$rem = substr($fontsize, 0, -3);
$newfontsize = $newfontsize * $rem;
} else if ($pos2 !== false) {
$em = substr($fontsize, 0, -2);
$newfontsize = $newfontsize * $em;
} else if ($pos3 !== false) {
$px = substr($fontsize, 0, -2);
$newfontsize = 0.75 * $px;
} else if (in_array($fontsize, array_keys($this->fontsizenames))) {
$newfontsize = $this->fontsizenames[$fontsize];
} else {
preg_match_all('!\d+!', $fontsize, $matches);
$newfontsize = $matches[0][0] ?? $newfontsize;
}
return $newfontsize;
}
}
3 changes: 1 addition & 2 deletions admin/tool/brickfield/classes/local/htmlchecker/common/checks/css_text_has_contrast.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,8 +92,7 @@ public function check(): void {
$italic = false;

if (isset($style['font-size'])) {
preg_match_all('!\d+!', $style['font-size'], $matches);
$fontsize = $matches[0][0];
$fontsize = $this->get_fontsize($style['font-size']);
}

if (isset($style['font-weight'])) {
Expand Down
112 changes: 112 additions & 0 deletions admin/tool/brickfield/tests/local/htmlchecker/common/checks/css_text_has_contrast_test.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -178,6 +178,54 @@ class css_text_has_contrast_test extends all_checks {
</html>
EOD;

/** @var string HTML with px18 fail colour values. */
private $px18 = <<<EOD
<body><p style="color:#EF0000; background-color:white; font-size: 18px">
This is not contrasty enough.</p></body>
EOD;

/** @var string HTML with px19bold pass colour values. */
private $px19bold = <<<EOD
<body><p style="color:#EF0000; background-color:white; font-size: 19px; font-weight: bold;">
This is contrasty enough.</p></body>
EOD;

/** @var string HTML with px18 pass colour values. */
private $px18pass = <<<EOD
<body><p style="color:#E60000; background-color:white; font-size: 18px">
This is contrasty enough.</p></body>
EOD;

/** @var string HTML with medium size colour values. */
private $mediumfail = <<<EOD
<body><p style="color:#EF0000; background-color:white; font-size: medium">
This is not contrasty enough.</p></body>
EOD;

/** @var string HTML with px18 colour values. */
private $mediumpass = <<<EOD
<body><p style="color:#E60000; background-color:white; font-size: medium">
This is contrasty enough.</p></body>
EOD;

/** @var string HTML with larger fail colour values. */
private $largerfail = <<<EOD
<body><p style="color:#FF6161; background-color:white; font-size: larger">
This is not contrasty enough.</p></body>
EOD;

/** @var string HTML with px18 colour values. */
private $largerpass = <<<EOD
<body><p style="color:#FF5C5C; background-color:white; font-size: larger;">
This is contrasty enough.</p></body>
EOD;

/** @var string HTML with px18 colour values. */
private $largerboldpass = <<<EOD
<body><p style="color:#FF5C5C; background-color:white; font-size: larger; font-weight: bold;">
This is contrasty enough.</p></body>
EOD;

/**
* Test for the area assign intro
*/
Expand Down Expand Up @@ -235,4 +283,68 @@ public function test_check_for_emptyvalues() {
$results = $this->get_checker_results($this->emptyvalue);
$this->assertEmpty($results);
}

/**
* Test for text px18 with insufficient contrast of 4.49.
*/
public function test_check_for_px18_fail() {
$results = $this->get_checker_results($this->px18);
$this->assertTrue($results[0]->element->tagName == 'p');
}

/**
* Test for text px19 bold with sufficient contrast of 4.49.
*/
public function test_check_for_px19bold_pass() {
$results = $this->get_checker_results($this->px19bold);
$this->assertEmpty($results);
}

/**
* Test for text px18 with sufficient contrast of 4.81.
*/
public function test_check_for_px18_pass() {
$results = $this->get_checker_results($this->px18pass);
$this->assertEmpty($results);
}

/**
* Test for medium (12pt) text with insufficient contrast of 4.49.
*/
public function test_check_for_medium_fail() {
$results = $this->get_checker_results($this->mediumfail);
$this->assertTrue($results[0]->element->tagName == 'p');
}

/**
* Test for medium (12pt) text with sufficient contrast of 4.81.
*/
public function test_check_for_medium_pass() {
$results = $this->get_checker_results($this->mediumpass);
$this->assertEmpty($results);
}

/**
* Test for larger (14pt) text with insufficient contrast of 2.94.
*/
public function test_check_for_larger_fail() {
$results = $this->get_checker_results($this->largerfail);
$this->assertTrue($results[0]->element->tagName == 'p');
}

/**
* Test for larger (14pt) text with insufficient contrast of 3.02.
*/
public function test_check_for_larger_pass() {
$results = $this->get_checker_results($this->largerpass);
$this->assertTrue($results[0]->element->tagName == 'p');
}

/**
* Test for larger (14pt) bold text with sufficient contrast of 3.02.
*/
public function test_check_for_largerbold_pass() {
$results = $this->get_checker_results($this->largerboldpass);
$this->assertEmpty($results);
}
}

0 comments on commit 70c91a4

Please sign in to comment.