Skip to content
This repository has been archived by the owner on Mar 9, 2024. It is now read-only.

Remove XHTML for a More Consistent HTML5 Markup #200

Merged
merged 71 commits into from
Oct 12, 2023

Conversation

DangitRick
Copy link
Contributor

Description

This pull request includes many small changes intended to remove XHTML markup in favor of HTML5 equivalents.

Motivation and context

HTML5 became the "next standard" for markup on the web back in 2007, with XHTML being obsolesced. By removing XHTML code from core, we are free to move forward with full HTML5 markup and practices, with more consistent code and less PHP to choose between markup alternatives.

It also gets us closer to pages with clean markup that validates on the W3C's validator.

What's Left to Do?

I don't know JavaScript, so I did not modify any JS files, though many showed up when searching for "/>" for example.

Posts still output closing slashes, such as <hr />, when self-closing elements are used.

I also avoided touching files that were obviously part of third party packages, such as SimplePie or PHPmailer.

How has this been tested?

On both my local and live installations, everything appears to be working smoothly. Using a test site with content from FakerPress, the W3C validator's results went from a couple dozen errors and warnings down to just a few.

Types of changes

  • Remove closing slashes from self-closing elements
  • Remove double-barreled boolean attributes in favor of their simpler forms (e.g., prefer selected over selected="selected"
  • Remove current_theme_supports('html5') and all logic related to it in favor of just using HTML5
  • Remove text/css and text/javascript type attributes from script and link tags.
  • Remove assorted role attributes on HTML5 elements such as nav or header where the role is already implied by the markup
  • Remove novalidate attributes from forms to enable client-side browser-based validation, providing users with instant form feedback while saving on system resources

Removed closing slashes from self-closing tags.

Removed `type="text/css"` from `style` tag.
Removed `/` from self-closing tag.

Removed `type="text/css"` from `style` tag.
Removed closing slash from self-closing tag.
Removed `type="text/css"` from `style` tag.

Removed closing slash from self-closing tag.
Remove closing slash from self-closing tag
Remove trailing slashes from self-closing tags
Remove `type="text/javascript"` from `script` tags.

Remove closing slashes from self-closing tags.
Remove closing slash from self-closing tag.
Remove closing slash from self-closing tag.
Remove closing slashes from self-closing tags.
Remove trailing slash from self-closing tag.
Remove closing slash from self-closing tags.
Remove closing slashes from self-closing tags.
Remove closing slash from self-closing tag.
Remove closing slash from self-closing tag.
Remove closing slashes from self-closing elements.
Remove `xhtml` as an option; default to `html`.
Default `get_search_form()` to outputting HTML5 markup, removing the XHTML option.
Removed the logic for choosing between 'html' and 'xhtml' in the language tags.
Simplify boolean attributes throughout core. (Based on attributes list here <https://meiert.com/en/blog/boolean-attributes-of-html/>)

Did not touch JS files or files in included third-party packages, like SimplePie.
Removes `novalidate` attributes from all forms to allow client-side validation of such as email addresses.
If ClassicPress doesn't do XHTML, then the Atom feeds will never output XHTML content. Enforce 'html'.
Remove choice between xhtml and html to default to html.

Remove closing slash from self-closing tag.
Remove choice between xhtml and html to default to html.

Remove closing slash from self-closing tag.
Remove choice between xhtml and html to default to html.

Remove closing slashes on self-closing tags.
Removed `comment()` function in favor of `html5_comment()`.

Remove closing slashes from self-closing tags.
Remove xhtml/html choice.

Remove closing slashes on self-closinig elements.
Remove xhtml/html choice to default to HTML5.

Remove closing slashes on self-closing tags.
Remove XHTML/HTML choice.

Remove JavaScript `type` attribute.

Remove closing slashes from self-closing tags.
No need to explicitly declare HTML5 support.
@mattyrob
Copy link
Collaborator

We need to think about where that MCE config code should go.
It seems there is already a filter applied to that in src/wp-includes/default-filters.php with the function contained in src/wp-includes/functions.php.

I wonder though is we can add the hook in src/wp-admin/includes/admin-filters.php if it is only needed in admin and maybe place the function itself in src/wp-includes/classicpress/class-cp-customization.php

<# } else if ( data.sizes && data.sizes.medium ) { #>
<img src="{{ data.sizes.medium.url }}" class="thumbnail" draggable="false" alt="" />
<# } else { #>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is incorrect, the #> needs restoring here to prevent JS errors in the Media Library.

@xxsimoxx
Copy link
Member

xxsimoxx commented Sep 14, 2023

It seems there is already a filter applied to that in src/wp-includes/default-filters.php with the function contained in src/wp-includes/functions.php.

In this way if a site enables tinyMCE for comments we get the right tags, not just in the post editor, so for me it is the best choice.

Edit: here the code.

Fixed broken syntax in media library

Add code to get TinyMCE to output HTML
@DangitRick
Copy link
Contributor Author

Fixed the above issue from @mattyrob and added the TinyMCE fix (dang, it was simpler than I thought!) from @xxsimoxx.

Local phpcs test returns no errors. Local phpunit test returns with 11073 errors and 122 warnings… Everything works on the test install, though. Version of PHP used: 8.2.0.

@xxsimoxx
Copy link
Member

@DangitRick can't see the new commits for TinyMCE and the template issue.
When I run phpunit I get about 240 errors, 10k seems to be a local issue.

@@ -4652,6 +4652,22 @@ function _mce_set_direction( $mce_init ) {
return $mce_init;
}

/**
* Sets elemenmt format to html.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"element"

@mattyrob mattyrob marked this pull request as ready for review September 28, 2023 13:01
Copy link
Member

@xxsimoxx xxsimoxx left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me.

@DangitRick DangitRick requested a review from mattyrob October 1, 2023 16:34
@mattyrob
Copy link
Collaborator

mattyrob commented Oct 3, 2023

I think this is very close to merge now.

The last few things as far as I know is:
current_theme_supports( 'html5' ) needs to return true always
add_theme_support( 'html5' ) needs to return a _doing_it_wrong() with an updated message.
Tests for the above need updating.

I am working on this now.

@mattyrob mattyrob merged commit 03d4938 into ClassicPress:develop Oct 12, 2023
9 checks passed
@ClassyBot
Copy link
Contributor

This pull request has been mentioned on ClassicPress Forums. There might be relevant details there:

https://forums.classicpress.net/t/theme-support-html5-was-called-incorrectly-html5/5007/4

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants