Skip to content

Remove jQuery in the frontend for Twenty Fifteen.#12410

Open
adamsilverstein wants to merge 9 commits into
WordPress:trunkfrom
adamsilverstein:remove/jquery-2015
Open

Remove jQuery in the frontend for Twenty Fifteen.#12410
adamsilverstein wants to merge 9 commits into
WordPress:trunkfrom
adamsilverstein:remove/jquery-2015

Conversation

@adamsilverstein

Copy link
Copy Markdown
Member
  • Replace jQuery usage in Twenty Fifteen frontend scripts with vanilla JS.
  • Don't require jQuery to be loaded in the frontend as a result of the above.

Refreshed version of #1682 (the original branch lives on a fork that can no longer be updated), merged with current trunk. Trunk changes since the original PR - the deferred loading strategy for twentyfifteen-script and the aria-expanded accessibility improvements in the menu toggles - are preserved in the vanilla JS implementation.

Trac ticket: https://core.trac.wordpress.org/ticket/54172

@github-actions

github-actions Bot commented Jul 6, 2026

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @felixarntz@google.com.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

Core Committers: Use this line as a base for the props when committing in SVN:

Props adamsilverstein.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions

github-actions Bot commented Jul 6, 2026

Copy link
Copy Markdown

Test using WordPress Playground

The changes in this pull request can previewed and tested using a WordPress Playground instance.

WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser.

Some things to be aware of

  • All changes will be lost when closing a tab with a Playground instance.
  • All changes will be lost when refreshing the page.
  • A fresh instance is created each time the link below is clicked.
  • Every time this pull request is updated, a new ZIP file containing all changes is created. If changes are not reflected in the Playground instance,
    it's possible that the most recent build failed, or has not completed. Check the list of workflow runs to be sure.

For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation.

Test this pull request with WordPress Playground.

- Fix always-true condition in the secondary toggle click handler:
  classList.contains() returns a boolean, so comparing against -1 meant
  aria-expanded was always set to 'true', even when closing the sidebar.
- Replace getElementsByTagName().forEach() with querySelectorAll(), as
  HTMLCollection has no forEach and the call threw a TypeError.
- Guard onResizeARIA and resizeAndScroll against missing elements to
  preserve the null-tolerance the previous jQuery code provided.
- Use a string value for the sidebar bottom style.
@adamsilverstein

Copy link
Copy Markdown
Member Author

Merged the latest trunk (clean, no conflicts) and fixed two runtime bugs found while re-reviewing the vanilla JS against the original review feedback on #1682:

  • The secondary toggle click handler compared classList.contains() (a boolean) against -1, making the condition always true, so aria-expanded was set to 'true' even when closing the sidebar.
  • sidebar.getElementsByTagName( 'button' ).forEach() threw a TypeError because HTMLCollection has no forEach; switched to querySelectorAll() as suggested in the original review.

Also added null guards in onResizeARIA() / resizeAndScroll() to preserve the null-tolerance the previous jQuery code provided in case a child theme removes those elements.

Verified in a browser harness: dropdown toggles update aria-expanded/aria-controls and submenu classes in both directions, the sidebar toggle now correctly reports aria-expanded="false" when closed, and scroll/resize handlers run without errors. jshint passes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant