Proyectos de Subversion Moodle

Rev

Rev 11 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
<?php
2
// This file is part of Moodle - http://moodle.org/
3
//
4
// Moodle is free software: you can redistribute it and/or modify
5
// it under the terms of the GNU General Public License as published by
6
// the Free Software Foundation, either version 3 of the License, or
7
// (at your option) any later version.
8
//
9
// Moodle is distributed in the hope that it will be useful,
10
// but WITHOUT ANY WARRANTY; without even the implied warranty of
11
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
12
// GNU General Public License for more details.
13
//
14
// You should have received a copy of the GNU General Public License
15
// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
16
 
17
/**
18
 * Class test_css_text_has_contrast test
19
 *
20
 * @package    tool_brickfield
21
 * @copyright  2020 onward: Brickfield Education Labs, https://www.brickfield.ie
22
 * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
23
 */
24
 
25
namespace tool_brickfield\local\htmlchecker\common\checks;
26
 
27
defined('MOODLE_INTERNAL') || die();
28
 
29
require_once('all_checks.php');
30
 
31
/**
32
 * Class test_css_text_has_contrast_test
1441 ariadna 33
 * @covers \tool_brickfield\local\htmlchecker\brickfield_accessibility
1 efrain 34
 */
1441 ariadna 35
final class css_text_has_contrast_test extends all_checks {
1 efrain 36
    /** @var string The check type. */
37
    protected $checktype = 'css_text_has_contrast';
38
 
39
    /** @var string HTML that should get flagged. */
40
    private $htmlfail1 = <<<EOD
41
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
42
    <html lang="en">
43
    <head>
44
    <title>OAC Testfile - Check #6 - Positive</title>
45
    </head>
46
    <body>
47
    <p style="color:#333333; background-color:#000000; font-weight: bold;">This is not contrasty enough.</p>
48
    </body>
49
    </html>
50
EOD;
51
 
52
    /** @var string HTML that should get flagged. */
53
    private $htmlfail2 = <<<EOD
54
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
55
    <html lang="en">
56
    <head>
57
    <title>OAC Testfile - Check #6 - Positive</title>
58
    </head>
59
    <body>
60
    <p style="color:#333333; background-color:#000000; font-size: 18px;">This is not contrasty enough.</p>
61
    </body>
62
    </html>
63
EOD;
64
 
65
    /** @var string HTML that should get flagged. */
66
    private $htmlfail3 = <<<EOD
67
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
68
    <html lang="en">
69
    <head>
70
    <title>OAC Testfile - Check #6 - Positive</title>
71
    </head>
72
    <body>
73
    <p style="color:#333333; background-color:#000000; font-size: 18%;">This is not contrasty enough.</p>
74
    </body>
75
    </html>
76
EOD;
77
 
78
    /** @var string HTML that should get flagged. */
79
    private $htmlfail4 = <<<EOD
80
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
81
    <html lang="en">
82
    <head>
83
    <title>OAC Testfile - Check #6 - Positive</title>
84
    </head>
85
    <body>
86
    <p style="color:#333333; background-color:#000000; font-size: 18em;">This is not contrasty enough.</p>
87
    </body>
88
    </html>
89
EOD;
90
 
91
    /** @var string HTML that should get flagged. */
92
    private $htmlfail5 = <<<EOD
93
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
94
    <html lang="en">
95
    <head>
96
    <title>OAC Testfile - Check #6 - Positive</title>
97
    </head>
98
    <body>
99
    <p style="color:#333333; background-color:#000000; font-size: 18ex;">This is not contrasty enough.</p>
100
    </body>
101
    </html>
102
EOD;
103
 
104
    /** @var string HTML that should get flagged. */
105
    private $htmlfail6 = <<<EOD
106
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
107
    <html lang="en">
108
    <head>
109
    <title>OAC Testfile - Check #6 - Positive</title>
110
    </head>
111
    <body>
112
    <p style="color:#333333; background-color:#000000;">This is not contrasty enough.</p>
113
    </body>
114
    </html>
115
EOD;
116
 
117
    /** @var string HTML that should not get flagged. */
118
    private $htmlpass = <<<EOD
119
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
120
    <html lang="en">
121
    <head>
122
    <title>OAC Testfile - Check #6 - Positive</title>
123
    </head>
124
    <body>
125
    <p style="color:#333333; background-color:#ffffff;">This is contrasty enough.</p>
126
    </body>
127
    </html>
128
EOD;
129
 
130
    /** @var string HTML that should get flagged. */
131
    private $namecolours = <<<EOD
132
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
133
    <html lang="en">
134
    <head>
135
    <title>OAC Testfile - Check #6 - Positive</title>
136
    </head>
137
    <body>
138
    <p style="color: red; background-color: blue;">This is not contrasty enough.</p>
139
    </body>
140
    </html>
141
EOD;
142
 
143
    /** @var string HTML with invalid colour names. */
144
    private $invalidcolours = <<<EOD
145
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
146
    <html lang="en">
147
    <head>
148
    <title>OAC Testfile - Check #6 - Positive</title>
149
    </head>
150
    <body>
151
    <p style="color: grog; background-color: numpi;">This is not contrasty enough.</p>
152
    </body>
153
    </html>
154
EOD;
155
 
156
    /** @var string HTML with invalid colour numeric values. */
157
    private $invalidvalue = <<<EOD
158
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
159
    <html lang="en">
160
    <head>
161
    <title>OAC Testfile - Check #6 - Positive</title>
162
    </head>
163
    <body>
164
    <p style="color: 10000500; background-color: -10234;">This is not contrasty enough.</p>
165
    </body>
166
    </html>
167
EOD;
168
 
169
    /** @var string HTML with empty colour values. */
170
    private $emptyvalue = <<<EOD
171
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
172
    <html lang="en">
173
    <head>
174
    <title>OAC Testfile - Check #6 - Positive</title>
175
    </head>
176
    <body>
177
    <p style="color:; background-color:;">This is not contrasty enough.</p>
178
    </body>
179
    </html>
180
EOD;
181
 
182
    /** @var string HTML with px18 fail colour values. */
183
    private $px18 = <<<EOD
184
    <body><p style="color:#EF0000; background-color:white; font-size: 18px">
185
    This is not contrasty enough.</p></body>
186
EOD;
187
 
188
    /** @var string HTML with px19bold pass colour values. */
189
    private $px19bold = <<<EOD
190
    <body><p style="color:#EF0000; background-color:white; font-size: 19px; font-weight: bold;">
191
    This is contrasty enough.</p></body>
192
EOD;
193
 
194
    /** @var string HTML with px18 pass colour values. */
195
    private $px18pass = <<<EOD
196
    <body><p style="color:#E60000; background-color:white; font-size: 18px">
197
    This is contrasty enough.</p></body>
198
EOD;
199
 
200
    /** @var string HTML with medium size colour values. */
201
    private $mediumfail = <<<EOD
202
    <body><p style="color:#EF0000; background-color:white; font-size: medium">
203
    This is not contrasty enough.</p></body>
204
EOD;
205
 
206
    /** @var string HTML with px18 colour values. */
207
    private $mediumpass = <<<EOD
208
    <body><p style="color:#E60000; background-color:white; font-size: medium">
209
    This is contrasty enough.</p></body>
210
EOD;
211
 
212
    /** @var string HTML with larger fail colour values. */
213
    private $largerfail = <<<EOD
214
    <body><p style="color:#FF6161; background-color:white; font-size: larger">
215
    This is not contrasty enough.</p></body>
216
EOD;
217
 
218
    /** @var string HTML with px18 colour values. */
219
    private $largerpass = <<<EOD
220
    <body><p style="color:#FF5C5C; background-color:white; font-size: larger;">
221
    This is contrasty enough.</p></body>
222
EOD;
223
 
224
    /** @var string HTML with px18 colour values. */
225
    private $largerboldpass = <<<EOD
226
    <body><p style="color:#FF5C5C; background-color:white; font-size: larger; font-weight: bold;">
227
    This is contrasty enough.</p></body>
228
EOD;
229
 
1441 ariadna 230
    /** @var string HTML with calculated size colour values. */
231
    private $calculatedfail = <<<EOD
232
    <body><p style="color:#EF0000; background-color:white; font-size: calc(0.90375rem + 0.045vw)">
233
    This is not contrasty enough.</p></body>
234
EOD;
235
 
236
    /** @var string HTML with calculated size colour values. */
237
    private $calculatedpass = <<<EOD
238
    <body><p style="color:#E60000; background-color:white; font-size: calc(0.90375rem + 0.045vw);">
239
    This is contrasty enough.</p></body>
240
EOD;
241
 
1 efrain 242
    /**
243
     * Test for the area assign intro
244
     */
11 efrain 245
    public function test_check(): void {
1 efrain 246
        $results = $this->get_checker_results($this->htmlfail1);
247
        $this->assertTrue($results[0]->element->tagName == 'p');
248
 
249
        $results = $this->get_checker_results($this->htmlfail2);
250
        $this->assertTrue($results[0]->element->tagName == 'p');
251
 
252
        $results = $this->get_checker_results($this->htmlfail3);
253
        $this->assertTrue($results[0]->element->tagName == 'p');
254
 
255
        $results = $this->get_checker_results($this->htmlfail4);
256
        $this->assertTrue($results[0]->element->tagName == 'p');
257
 
258
        $results = $this->get_checker_results($this->htmlfail5);
259
        $this->assertTrue($results[0]->element->tagName == 'p');
260
 
261
        $results = $this->get_checker_results($this->htmlfail6);
262
        $this->assertTrue($results[0]->element->tagName == 'p');
263
 
264
        $results = $this->get_checker_results($this->htmlpass);
265
        $this->assertEmpty($results);
266
    }
267
 
268
    /**
269
     * Test with valid colour names.
270
     */
11 efrain 271
    public function test_check_for_namedcolours(): void {
1 efrain 272
        $results = $this->get_checker_results($this->namecolours);
273
        $this->assertTrue($results[0]->element->tagName == 'p');
274
    }
275
 
276
    /**
277
     * Test with invalid colour names.
278
     */
11 efrain 279
    public function test_check_for_invalidcolours(): void {
1 efrain 280
        $results = $this->get_checker_results($this->invalidcolours);
281
        $this->assertTrue($results[0]->element->tagName == 'p');
282
    }
283
 
284
    /**
285
     * Test with invalid colour numeric values.
286
     */
11 efrain 287
    public function test_check_for_invalidvalues(): void {
1 efrain 288
        $results = $this->get_checker_results($this->invalidvalue);
289
        $this->assertTrue($results[0]->element->tagName == 'p');
290
    }
291
 
292
    /**
293
     * Test with empty colour values.
294
     */
11 efrain 295
    public function test_check_for_emptyvalues(): void {
1 efrain 296
        $results = $this->get_checker_results($this->emptyvalue);
297
        $this->assertEmpty($results);
298
    }
299
 
300
    /**
301
     * Test for text px18 with insufficient contrast of 4.49.
302
     */
11 efrain 303
    public function test_check_for_px18_fail(): void {
1 efrain 304
        $results = $this->get_checker_results($this->px18);
305
        $this->assertTrue($results[0]->element->tagName == 'p');
306
    }
307
 
308
    /**
309
     * Test for text px19 bold with sufficient contrast of 4.49.
310
     */
11 efrain 311
    public function test_check_for_px19bold_pass(): void {
1 efrain 312
        $results = $this->get_checker_results($this->px19bold);
313
        $this->assertEmpty($results);
314
    }
315
 
316
    /**
317
     * Test for text px18 with sufficient contrast of 4.81.
318
     */
11 efrain 319
    public function test_check_for_px18_pass(): void {
1 efrain 320
        $results = $this->get_checker_results($this->px18pass);
321
        $this->assertEmpty($results);
322
    }
323
 
324
    /**
325
     * Test for medium (12pt) text with insufficient contrast of 4.49.
326
     */
11 efrain 327
    public function test_check_for_medium_fail(): void {
1 efrain 328
        $results = $this->get_checker_results($this->mediumfail);
329
        $this->assertTrue($results[0]->element->tagName == 'p');
330
    }
331
 
332
    /**
333
     * Test for medium (12pt) text with sufficient contrast of 4.81.
334
     */
11 efrain 335
    public function test_check_for_medium_pass(): void {
1 efrain 336
        $results = $this->get_checker_results($this->mediumpass);
337
        $this->assertEmpty($results);
338
    }
339
 
340
    /**
341
     * Test for larger (14pt) text with insufficient contrast of 2.94.
342
     */
11 efrain 343
    public function test_check_for_larger_fail(): void {
1 efrain 344
        $results = $this->get_checker_results($this->largerfail);
345
        $this->assertTrue($results[0]->element->tagName == 'p');
346
    }
347
 
348
    /**
349
     * Test for larger (14pt) text with insufficient contrast of 3.02.
350
     */
11 efrain 351
    public function test_check_for_larger_pass(): void {
1 efrain 352
        $results = $this->get_checker_results($this->largerpass);
353
        $this->assertTrue($results[0]->element->tagName == 'p');
354
    }
355
 
356
    /**
357
     * Test for larger (14pt) bold text with sufficient contrast of 3.02.
358
     */
11 efrain 359
    public function test_check_for_largerbold_pass(): void {
1 efrain 360
        $results = $this->get_checker_results($this->largerboldpass);
361
        $this->assertEmpty($results);
362
    }
1441 ariadna 363
 
364
    /**
365
     * Test for rgb colors with insufficient contrast.
366
     */
367
    public function test_bad_rgbcolor(): void {
368
        $html = '<body><p style="color:rgb(255, 255, 255); background-color:rgb(204, 204, 204);">
369
            This is not contrasty enough.</p></body>';
370
        $results = $this->get_checker_results($html);
371
        $this->assertTrue($results[0]->element->tagName == 'p');
372
    }
373
 
374
    /**
375
     * Test for rgb colors with sufficient contrast.
376
     */
377
    public function test_good_rgbcolor(): void {
378
        $html = '<body><p style="color:rgb(255, 255, 255); background-color:rgb(0, 0, 0);">
379
            This is contrasty enough.</p></body>';
380
        $results = $this->get_checker_results($html);
381
        $this->assertEmpty($results);
382
    }
383
 
384
    /**
385
     * Test for named colors with insufficient contrast.
386
     */
387
    public function test_bad_namedcolor2(): void {
388
        $html = '<body><p style="color:lightcyan; background-color:lavender;">
389
            This is not contrasty enough.</p></body>';
390
        $results = $this->get_checker_results($html);
391
        $this->assertTrue($results[0]->element->tagName == 'p');
392
    }
393
 
394
    /**
395
     * Test for named colors with sufficient contrast.
396
     */
397
    public function test_good_namedcolor2(): void {
398
        $html = '<body><p style="color:linen; background-color:darkslategray;">
399
            This is contrasty enough.</p></body>';
400
        $results = $this->get_checker_results($html);
401
        $this->assertEmpty($results);
402
    }
403
 
404
    /**
405
     * Test for background value with insufficient contrast.
406
     */
407
    public function test_bad_backgroundcss(): void {
408
        $html = '<body><p style="color:lightcyan; background:fixed lavender center;">
409
            This is not contrasty enough.</p></body>';
410
        $results = $this->get_checker_results($html);
411
        $this->assertTrue($results[0]->element->tagName == 'p');
412
    }
413
 
414
    /**
415
     * Test for background value with sufficient contrast.
416
     */
417
    public function test_good_backgroundcss(): void {
418
        $html = '<body><p style="color:linen; background:fixed darkslategray center;">
419
            This is contrasty enough.</p></body>';
420
        $results = $this->get_checker_results($html);
421
        $this->assertEmpty($results);
422
    }
423
 
424
    /**
425
     * Test for background value with rgb with insufficient contrast.
426
     */
427
    public function test_bad_backgroundcssrgb(): void {
428
        $html = '<body><p style="color:rgb(255, 255, 255); background:fixed rgb(204, 204, 204) center;">
429
            This is not contrasty enough.</p></body>';
430
        $results = $this->get_checker_results($html);
431
        $this->assertTrue($results[0]->element->tagName == 'p');
432
    }
433
 
434
    /**
435
     * Test for background value with rgb with sufficient contrast.
436
     */
437
    public function test_good_backgroundcssrgb(): void {
438
        $html = '<body><p style="color:rgb(255, 255, 255); background:fixed rgb(0, 0, 0) center;">
439
            This is contrasty enough.</p></body>';
440
        $results = $this->get_checker_results($html);
441
        $this->assertEmpty($results);
442
    }
443
 
444
    /**
445
     * Test for text with insufficient contrast of 4.3.
446
     */
447
    public function test_bad_contrastrounding(): void {
448
        $html = '<body><p style="color:#F50000; background-color:white; font-size: 12px">
449
            This is not contrasty enough.</p></body>';
450
        $results = $this->get_checker_results($html);
451
        $this->assertTrue($results[0]->element->tagName == 'p');
452
    }
453
 
454
    /**
455
     * Test for background value with rgba with insufficient contrast.
456
     */
457
    public function test_bad_backgroundcssrgba(): void {
458
        $html = '<body><p style="color:rgba(255, 255, 255, 0.5); background:fixed rgba(0, 204, 204, 0.5) center;">
459
            This is not contrasty enough.</p></body>';
460
        $results = $this->get_checker_results($html);
461
        $this->assertTrue($results[0]->element->tagName == 'p');
462
    }
463
 
464
    /**
465
     * Test for background value with rgba with sufficient contrast.
466
     */
467
    public function test_good_backgroundcssrgba(): void {
468
        $html = '<body><p style="color:rgba(255, 255, 255, 0.75); background:fixed rgba(0, 0, 0, 0.75) center;">
469
            This is contrasty enough.</p></body>';
470
        $results = $this->get_checker_results($html);
471
        $this->assertEmpty($results);
472
    }
473
 
474
    /**
475
     * Test for calculated (12pt) text with insufficient contrast of 4.49.
476
     */
477
    public function test_check_for_calculated_fail(): void {
478
        $results = $this->get_checker_results($this->calculatedfail);
479
        $this->assertTrue($results[0]->element->tagName == 'p');
480
    }
481
 
482
    /**
483
     * Test for calculated (12pt) text with sufficient contrast of 4.81.
484
     */
485
    public function test_check_for_calculated_pass(): void {
486
        $results = $this->get_checker_results($this->calculatedpass);
487
        $this->assertEmpty($results);
488
    }
1 efrain 489
}