Add unit test cases

ampproject · Jan 7, 2022 · cecd69e · cecd69e
1 parent 8597685
commit cecd69e
Show file tree

Hide file tree

Showing 2 changed files with 119 additions and 4 deletions.
diff --git a/includes/sanitizers/class-amp-accessibility-sanitizer.php b/includes/sanitizers/class-amp-accessibility-sanitizer.php
@@ -23,7 +23,7 @@ class AMP_Accessibility_Sanitizer extends AMP_Base_Sanitizer {
 	 */
 	public function sanitize() {
 		$this->add_role_and_tabindex_to_on_tap_actors();
-		$this->add_gutenberg_the_skip_link();
+		$this->add_skip_link();
 	}
 
 	/**
@@ -75,7 +75,7 @@ static function ( $predicate ) {
 	 *
 	 * @return void
 	 */
-	public function add_gutenberg_the_skip_link() {
+	public function add_skip_link() {
 
 		// Early exit if not a block theme.
 		if ( ! current_theme_supports( 'block-templates' ) ) {
@@ -149,13 +149,13 @@ public function add_gutenberg_the_skip_link() {
 			Tag::A,
 			[
 				Attribute::CLASS_ => 'skip-link screen-reader-text',
-				Attribute::HREF   => $skip_link_target,
+				Attribute::HREF   => "#$skip_link_target",
 			]
 		);
 
 		$skip_link->appendChild( $this->dom->createTextNode( esc_html__( 'Skip to content', 'amp' ) ) );
 
-		$body->insertBefore( $style_node, $body->firstChild );
 		$body->insertBefore( $skip_link, $body->firstChild );
+		$body->insertBefore( $style_node, $body->firstChild );
 	}
 }
diff --git a/tests/php/test-class-amp-accessibility-sanitizer.php b/tests/php/test-class-amp-accessibility-sanitizer.php
@@ -10,11 +10,47 @@
 
 /**
  * Tests the accessibility sanitizer class.
+ *
+ * @coversDefaultClass AMP_Accessibility_Sanitizer
  */
 class AMP_Accessibility_Sanitizer_Test extends TestCase {
 
 	use MarkupComparison;
 
+	/** @var string */
+	private $original_wp_current_template_content;
+
+	/** @var array */
+	private $original_wp_theme_features;
+
+	/**
+	 * Setup.
+	 *
+	 * @inheritDoc
+	 */
+	public function setUp() {
+
+		parent::setUp();
+
+		global $_wp_current_template_content, $_wp_theme_features;
+		$this->original_wp_current_template_content = $_wp_current_template_content;
+		$this->original_wp_theme_features           = $_wp_theme_features;
+	}
+
+	/**
+	 * Tear down.
+	 *
+	 * @inheritDoc
+	 */
+	public function tearDown() {
+
+		parent::tearDown();
+
+		global $_wp_current_template_content, $_wp_theme_features;
+		$_wp_current_template_content = $this->original_wp_current_template_content;
+		$_wp_theme_features           = $this->original_wp_theme_features;
+	}
+
 	public function get_sanitize_test_data() {
 		return [
 			'valid markup remains unchanged'            => [
@@ -68,4 +104,83 @@ public function test_sanitize( $source, $expected ) {
 
 		$this->assertEqualMarkup( $expected, $actual );
 	}
+
+	/**
+	 * Data provider for $this->test_add_skip_link()
+	 *
+	 * @return string[][]
+	 */
+	public function get_skip_link_test_data() {
+
+		$style_element = '<style id="skip-link-styles">.skip-link.screen-reader-text {
+				border: 0;
+				clip: rect(1px,1px,1px,1px);
+				clip-path: inset(50%);
+				height: 1px;
+				margin: -1px;
+				overflow: hidden;
+				padding: 0;
+				position: absolute !important;
+				width: 1px;
+				word-wrap: normal !important;
+			}
+
+			.skip-link.screen-reader-text:focus {
+				background-color: #eee;
+				clip: auto !important;
+				clip-path: none;
+				color: #444;
+				display: block;
+				font-size: 1em;
+				height: auto;
+				left: 5px;
+				line-height: normal;
+				padding: 15px 23px 14px;
+				text-decoration: none;
+				top: 5px;
+				width: auto;
+				z-index: 100000;
+			}</style>';
+
+		return [
+			'with_id'              => [
+				'source'   => '<html><body><main id="main-container">Hello World!</main></body></html>',
+				'expected' => $style_element . '<a class="skip-link screen-reader-text" href="#main-container">Skip to content</a><main id="main-container">Hello World!</main>',
+			],
+			'without_id'           => [
+				'source'   => '<html><body><main>Hello World!</main></body></html>',
+				'expected' => $style_element . '<a class="skip-link screen-reader-text" href="#wp--skip-link--target">Skip to content</a><main>Hello World!</main>',
+			],
+			'without_main_element' => [
+				'source'   => '<html><body><div id="main-container">Hello World!</div></body></html>',
+				'expected' => '<div id="main-container">Hello World!</div>',
+			],
+		];
+
+	}
+
+	/**
+	 * @dataProvider get_skip_link_test_data
+	 *
+	 * @covers ::add_skip_link()
+	 *
+	 * @param string $source   Source HTML.
+	 * @param string $expected Expected target HTML.
+	 */
+	public function test_add_skip_link( $source, $expected ) {
+
+		global $_wp_current_template_content, $_wp_theme_features;
+
+		$_wp_current_template_content          = true;
+		$_wp_theme_features['block-templates'] = true;
+
+		$dom = AMP_DOM_Utils::get_dom_from_content( $source );
+
+		$sanitizer = new AMP_Accessibility_Sanitizer( $dom );
+		$sanitizer->add_skip_link();
+
+		$actual = AMP_DOM_Utils::get_content_from_dom( $dom );
+
+		$this->assertEquals( $expected, $actual );
+	}
 }