js: fix Javascript failures in Seamonkey/Palemoon.
Fix site Javascript failing to load in Seamonkey, Palemoon, and other
older browsers.
The @alpinejs/morph library uses public instance fields, which is ES2022
syntax not supported in older browsers. This is the code:
var DomManager = class {
el = void 0; // `el` is a public instance field
}
// => SyntaxError: bad method definition
The fix here is to separate the Alpine code into a separate bundle so
that a failure to load it doesn't cause the rest of the site's
Javascript to fail to load.
A better fix would be to either transpile the @alpinejs/morph library to
ES5 (which seems difficult to do in webpacker), or to fix the library
upstream to not use this syntax.
* https://inspiredwebdev.com/everything-new-in-es2022/
* https://blog.saeloun.com/2021/10/21/ecmacscript-public-instance-fields-and-private-instance-fields.html
* https://caniuse.com/?search=public%20class%20fields
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Public_class_fields#public_instance_fields
This commit is contained in:
@@ -23,9 +23,9 @@
|
||||
|
||||
<%# XXX hack to only load Ruffle on Flash posts %>
|
||||
<% if controller_name == "posts" && action_name == "show" && @post&.is_flash? %>
|
||||
<%= javascript_pack_tag "application", "flash", defer: false %>
|
||||
<%= javascript_pack_tag "application", "alpine", "flash", defer: false %>
|
||||
<% else %>
|
||||
<%= javascript_pack_tag "application", defer: false %>
|
||||
<%= javascript_pack_tag "application", "alpine", defer: false %>
|
||||
<% end %>
|
||||
|
||||
<%= stylesheet_pack_tag "application" %>
|
||||
|
||||
Reference in New Issue
Block a user