Skip to content

Commit

Permalink
Update tests for semantic Markdown permalink headers
Browse files Browse the repository at this point in the history
  • Loading branch information
@caendesilva
caendesilva committed Dec 5, 2024
1 parent 5f90cbc commit af9f4fa
Show file tree
Hide file tree
Showing 4 changed files with 20 additions and 20 deletions.
24 changes: 12 additions & 12 deletions packages/framework/tests/Feature/MarkdownHeadingRendererTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ public function testPermalinksInDocumentationPages()
// $this->assertStringContainsString('aria-label="Permalink to this heading"', $html);

$this->assertSame(<<<'HTML'
<h2 id="documentation-heading">Documentation Heading<a href="#documentation-heading" class="heading-permalink" title="Permalink"></a></h2>
<h2 id="documentation-heading" class="group w-fit">Documentation Heading<a href="#documentation-heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>

HTML, $html);
}
Expand Down Expand Up @@ -117,12 +117,12 @@ public function testHeadingsWithCustomAttributesAndPermalinks()

$html = (new MarkdownService($markdown, DocumentationPage::class))->parse();

$this->assertStringContainsString('class="custom-class"', $html);
$this->assertStringContainsString('class="custom-class group w-fit"', $html);
$this->assertStringContainsString('data-test="value"', $html);

$this->assertSame(<<<'HTML'
<h2 class="custom-class" id="heading">Heading<a href="#heading" class="heading-permalink" title="Permalink"></a></h2>
<h3 data-test="value" id="another-heading">Another Heading<a href="#another-heading" class="heading-permalink" title="Permalink"></a></h3>
<h2 class="custom-class group w-fit" id="heading">Heading<a href="#heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>
<h3 data-test="value" id="another-heading" class="group w-fit">Another Heading<a href="#another-heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h3>

HTML, $html);
}
Expand All @@ -144,17 +144,17 @@ public function testPermalinkConfigurationLevels()
$html = (new MarkdownService($markdown, DocumentationPage::class))->parse();

$this->assertStringNotContainsString('<h1>H1 No Permalink</h1><a', $html);
$this->assertStringContainsString('<h2 id="h2-has-permalink">H2 Has Permalink<a', $html);
$this->assertStringContainsString('<h3 id="h3-has-permalink">H3 Has Permalink<a', $html);
$this->assertStringContainsString('<h4 id="h4-has-permalink">H4 Has Permalink<a', $html);
$this->assertStringContainsString('<h2 id="h2-has-permalink" class="group w-fit">H2 Has Permalink<a', $html);
$this->assertStringContainsString('<h3 id="h3-has-permalink" class="group w-fit">H3 Has Permalink<a', $html);
$this->assertStringContainsString('<h4 id="h4-has-permalink" class="group w-fit">H4 Has Permalink<a', $html);
$this->assertStringNotContainsString('<h5>H5 No Permalink</h1><a', $html);
$this->assertStringNotContainsString('<h6>H6 No Permalink</h1><a', $html);

$this->assertSame(<<<'HTML'
<h1>H1 No Permalink</h1>
<h2 id="h2-has-permalink">H2 Has Permalink<a href="#h2-has-permalink" class="heading-permalink" title="Permalink"></a></h2>
<h3 id="h3-has-permalink">H3 Has Permalink<a href="#h3-has-permalink" class="heading-permalink" title="Permalink"></a></h3>
<h4 id="h4-has-permalink">H4 Has Permalink<a href="#h4-has-permalink" class="heading-permalink" title="Permalink"></a></h4>
<h2 id="h2-has-permalink" class="group w-fit">H2 Has Permalink<a href="#h2-has-permalink" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>
<h3 id="h3-has-permalink" class="group w-fit">H3 Has Permalink<a href="#h3-has-permalink" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h3>
<h4 id="h4-has-permalink" class="group w-fit">H4 Has Permalink<a href="#h4-has-permalink" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h4>
<h5>H5 No Permalink</h5>
<h6>H6 No Permalink</h6>

Expand Down Expand Up @@ -185,8 +185,8 @@ public function testHeadingsWithSpecialCharacters()

// Todo: Try to normalize to heading-with-special-characters?
$this->assertSame(<<<'HTML'
<h2 id="heading-with-amp-special-lt-gt-quotcharactersquot">Heading with &amp; special &lt; &gt; &quot;characters&quot;<a href="#heading-with-amp-special-lt-gt-quotcharactersquot" class="heading-permalink" title="Permalink"></a></h2>
<h3 id="heading-with-emojis">Heading with émojis 🎉<a href="#heading-with-emojis" class="heading-permalink" title="Permalink"></a></h3>
<h2 id="heading-with-amp-special-lt-gt-quotcharactersquot" class="group w-fit">Heading with &amp; special &lt; &gt; &quot;characters&quot;<a href="#heading-with-amp-special-lt-gt-quotcharactersquot" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>
<h3 id="heading-with-emojis" class="group w-fit">Heading with émojis 🎉<a href="#heading-with-emojis" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h3>

HTML, $html);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/framework/tests/Feature/MarkdownServiceTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ public function testServiceCanParseMarkdownToHtmlWithPermalinksDependingOnConfig
$this->assertIsString($html);
$this->assertStringContainsString('heading-permalink', $html, 'Permalink should be added to documentation pages by default');
$this->assertSame(
'<h2 id="hello-world">Hello World!<a href="#hello-world" class="heading-permalink" title="Permalink"></a></h2>'."\n", $html
'<h2 id="hello-world" class="group w-fit">Hello World!<a href="#hello-world" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>'."\n", $html
);

$html = (new MarkdownService($markdown))->parse();
Expand Down
4 changes: 2 additions & 2 deletions packages/framework/tests/Feature/StaticSiteBuilderDocumentationModuleTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ public function testPageContainsExpectedContent()
{
$this->inspectHtml([
'Adventures in Wonderland',
'<h2 id="chapter-i-down-the-rabbit-hole">CHAPTER I. DOWN THE RABBIT-HOLE.<a href="#chapter-i-down-the-rabbit-hole" class="heading-permalink" title="Permalink"></a></h2>',
'<h2 id="chapter-i-down-the-rabbit-hole" class="group w-fit">CHAPTER I. DOWN THE RABBIT-HOLE.<a href="#chapter-i-down-the-rabbit-hole" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>',
'<p>So she was considering in her own mind, as well as she could',
]);
}
Expand All @@ -55,7 +55,7 @@ public function testCanCompilePageToRootOutputDirectory()

$this->inspectHtml([
'Adventures in Wonderland',
'<h2 id="chapter-i-down-the-rabbit-hole">CHAPTER I. DOWN THE RABBIT-HOLE.<a href="#chapter-i-down-the-rabbit-hole" class="heading-permalink" title="Permalink"></a></h2>',
'<h2 id="chapter-i-down-the-rabbit-hole" class="group w-fit">CHAPTER I. DOWN THE RABBIT-HOLE.<a href="#chapter-i-down-the-rabbit-hole" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>',
'<p>So she was considering in her own mind, as well as she could',
], '_site/test-page.html');
}
Expand Down
10 changes: 5 additions & 5 deletions packages/framework/tests/Unit/HeadingRendererUnitTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ public function testCanRenderHeading()
$this->assertStringContainsString('<h2', $rendered);
$this->assertStringContainsString('</h2>', $rendered);

$this->assertSame('<h2 id="test-heading">Test Heading<a href="#test-heading" class="heading-permalink" title="Permalink"></a></h2>', $rendered);
$this->assertSame('<h2 id="test-heading" class="group w-fit">Test Heading<a href="#test-heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>', $rendered);
}

public function testAddsPermalinkToValidHeadings()
Expand Down Expand Up @@ -124,7 +124,7 @@ public function testForwardsHeadingAttributes()
$heading->data->set('attributes', ['class' => 'custom-class']);
$rendered = $renderer->render($heading, $childRenderer);

$this->assertStringContainsString('class="custom-class"', $rendered);
$this->assertStringContainsString('class="custom-class group w-fit', $rendered);
}

public function testForwardsArbitraryHeadingAttributes()
Expand All @@ -148,7 +148,7 @@ public function testMergesAllHeadingAttributes()
$heading->data->set('attributes', ['class' => 'custom-class', 'foo' => 'bar']);
$rendered = $renderer->render($heading, $childRenderer);

$this->assertStringContainsString('class="custom-class"', $rendered);
$this->assertStringContainsString('class="custom-class group w-fit"', $rendered);
$this->assertStringContainsString('foo="bar"', $rendered);
}

Expand Down Expand Up @@ -186,12 +186,12 @@ public function testPostProcessMethodNormalizesInputToMatchCommonMark()
$html = <<<'HTML'
<h2 >
Test Heading
<a id="test-heading" href="#test-heading" class="heading-permalink" title="Permalink"></a>
<a id="test-heading" href="#test-heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a>
</h2>
HTML;

// What CommonMark would generate from the same input Markdown
$expected = '<h2>Test Heading<a id="test-heading" href="#test-heading" class="heading-permalink" title="Permalink"></a></h2>';
$expected = '<h2>Test Heading<a id="test-heading" href="#test-heading" class="heading-permalink opacity-0 ml-1 transition-opacity duration-300 ease-linear px-1 group-hover:opacity-100 focus:opacity-100 group-hover:grayscale-0 focus:grayscale-0" title="Permalink">#</a></h2>';

$this->assertSame($expected, (new HeadingRenderer())->postProcess($html));
}
Expand Down

0 comments on commit af9f4fa

Please sign in to comment.