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

Bug: 6.7 javascript breaks jquery #20423

Open
2 tasks done
dougroutledge opened this issue Nov 19, 2024 · 7 comments
Open
2 tasks done

Bug: 6.7 javascript breaks jquery #20423

dougroutledge opened this issue Nov 19, 2024 · 7 comments
Assignees
@robmadole
Labels
bug svg

Comments

@dougroutledge
Copy link

dougroutledge commented Nov 19, 2024 •
edited by tagliala
Loading

Bug description

After updating from 6.6 to 6.7 jquery breaks and a console.log($) returns fontawesome items instead of jquery.

Reproducible test case

No response

Screenshots

No response

Font Awesome version

v6.7.0

Serving

Self-hosted

Implementation

CSS JS (edit by @tagliala)

Browser and Operating System

Any browser, any os.

Web bug report checklist

  • I have included a test case because my odds go way up that the team can fix this when I do
  • I have searched for existing issues and to the best of my knowledge this is not a duplicate
@dougroutledge dougroutledge added bug needs-triage This bug needs to be confirmed labels Nov 19, 2024
@robmadole
Copy link
Member

@dougroutledge if you can give us a reproduction we'll take a look.

@dougroutledge
Copy link
Author

confirmed with 6.7.1 as well. I replace all.min.css, all.min.js, and v4 shim css and js files with 6.6.0 and it's fine. 6.7.0 and 6.7.1 throw an error about $, and a console.log($) doesn't return jquery objects it returns fontawesome objects instead. I don't have any of this in a production where you could access it currently. Let me see if I can build a small solution that can illustrate it.

@dougroutledge
Copy link
Author

Oddly enough if I load the free one from cdn instead of the pro from the local folder, it doesn't error, it just have 75% of my icons missing.

@dougroutledge
Copy link
Author

image

@tagliala
Copy link
Member

Hello,

in the opening post

Implementation
CSS

is mentioned, however in the subsequent message I can see

I replace all.min.css, all.min.js, and v4 shim css and js files with 6.6.0 and it's fine

This does not look correct

This is using both css and js implementation, I would not expect both of them being load

I can't see how tthe CSS only implementation can interfere with jQuery.

So we should suppose it is the issue is with a self-hosted javascript file + shims?

@dougroutledge
Copy link
Author

Moving Jquery's script load to after FA, seems to fix whatever FA is doing with $. All previous versions functioned as expected loaded jquery first.

@tagliala
Copy link
Member

tagliala commented Nov 20, 2024 •
edited
Loading

@robmadole I managed to easily replicate

  1. Download PRO 6.7.1 assets from fontawesome.com
  2. Create a new folder with the following html template:
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>FA 20423</title>
    <meta name="description" content="fa" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <script src="assets/all.min.js"></script>
  </head>
  <body>
    <p>
      <i class="fas fa-ufo"></i>
    </p>
    <p>
      <small>
        <a href="https://github.com/FortAwesome/Font-Awesome/issues/20423">Reproducible use case for #20423</a>
      </small>
    </p>
  </body>
</html>
  1. Copy all.min.js into assets/all.min.js
  2. Open the console and run console.log($)

Expected

$ not to be defined

Actual

image

@tagliala tagliala added svg and removed needs-triage This bug needs to be confirmed labels Nov 20, 2024
@tagliala tagliala changed the title Bug: 6.7 breaks jquery Bug: 6.7 javascript breaks jquery Nov 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@robmadole robmadole

Labels
bug svg
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@robmadole @tagliala @dougroutledge