Skip to content
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

Jump to bottom

Documents must have <title> element to aid in navigation Fails on title in head tag #4580

Closed
1 task done
Rathch opened this issue Sep 15, 2024 · 3 comments
Closed
1 task done

Documents must have <title> element to aid in navigation Fails on title in head tag #4580

Rathch opened this issue Sep 15, 2024 · 3 comments
Labels
ungroomed Ticket needs a maintainer to prioritize and label

Comments

@Rathch
Copy link

Rathch commented Sep 15, 2024

Product

axe-core

Product Version

No response

Latest Version

  • I have tested the issue with the latest version of the product

Issue Description

The test fails on not recognizing the title tag when it's not in HTML root but a child of the head tag

<!doctype html>
<html lang="en">
  <head>
    <title>This will fail</title>     
  </head>
  <body>
      ...   
  </body> 
</html>

<!doctype html>
<html lang="en">
  <title>This will work</title>
  <head>
         
  </head>
  <body>
      ...   
  </body> 
</html>

but it's valid and best practice to have it like this https://www.w3.org/WAI/WCAG21/Techniques/html/H25.html
@Rathch Rathch added the ungroomed Ticket needs a maintainer to prioritize and label label Sep 15, 2024
@straker
Copy link
Contributor

straker commented Sep 16, 2024 •
edited
Loading

Thanks for the issue. The reason for this is that browsers automatically reformat the invalid HTML into valid HTML by placing the title into the head element.

So this:

<!doctype html>
<html lang="en">
  <title>This will work</title>
  <head>
         
  </head>
  <body>
      ...   
  </body> 
</html>

Is changed into the following when rendered:

<html lang="en">
  <head>
    <title>This will work</title>
  </head>
  <body>
    <text>
      ...
    </text>
  </body>
</html>

@straker straker closed this as completed Sep 16, 2024
@Rathch
Copy link
Author

Rathch commented Sep 23, 2024

@straker

yes, my problem is that it's placed correct in the head. But the axe test for checking if there is a title fails because it is in the head and not in the html.

I am using the Playwright-axe integration to test the rendered page.

@straker
Copy link
Contributor

straker commented Sep 23, 2024

I'm afraid I don't quite understand. So the rule that checks for title is the document-title rule. Are you saying that that rule is failing to find a title element even when the title is in the head?

I'm not sure how the test would fail as we use document.title to determine if there is a title. Would it be possible to see the page where the issue is occurring? Or possibly a minimal setup example with Playwright-axe that shows the issue? When I open both HTML examples provided in the original issue comment, axe-core passes document-title.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
ungroomed Ticket needs a maintainer to prioritize and label
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@straker @Rathch