Skip to content

Commit e6a66d0

Browse files
committed
fix: replace broken chosen-rails gem with official Chosen v1.8.7 assets
## Problem The chosen-rails gem's support-rails-8 branch has broken CoffeeScript compilation that causes Chosen dropdowns to appear empty despite having populated <option> elements in the DOM. The CoffeeScript comprehension syntax was compiling to broken JavaScript with uninitialized loop variables (`for (undefined; i < len; i++)`), causing loops to never execute. This affected both option parsing and DOM rendering. ## Root Cause CoffeeScript 1.12.2 (from 2016) combined with the support-rails-8 branch produces incorrect JavaScript compilation for comprehension loops. ## Solution Removed the chosen-rails gem dependency and replaced it with official pre-compiled Chosen v1.8.7 assets in vendor/: - vendor/assets/javascripts/chosen.jquery.js - vendor/assets/stylesheets/chosen.css - vendor/assets/images/chosen-sprite.png - vendor/assets/images/chosen-sprite@2x.png Updated application.js to require chosen.jquery from vendor instead of the gem. ## Benefits 1. Avoids CoffeeScript compilation issues entirely 2. Removes unnecessary gem dependency 3. Full control over Chosen version 4. Simpler asset pipeline (no gem-based asset resolution) ## Additional Fixes - Fixed JavaScript syntax error in application.js (chosen() options) - Fixed script loading order (jQuery before Bootstrap) - Added blank prompt option to members dropdown ## Testing Verified working: - Member directory dropdown (240 members) - Search/filter functionality - Keyboard navigation - Single deselect option ## Future Consideration This uses the jQuery-dependent Chosen library. Long-term, consider replacing with a modern JavaScript alternative without jQuery dependency.
1 parent f7328d9 commit e6a66d0

8 files changed

Lines changed: 1863 additions & 48 deletions

File tree

Gemfile

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,8 @@ gem 'pagy', '~> 43.2'
5151
gem 'icalendar'
5252
gem 'tzinfo-data'
5353

54-
gem 'chosen-rails', github: 'olleolleolle/chosen-rails', branch: 'support-rails-8'
54+
# Chosen JavaScript and CSS loaded from vendor/assets/ instead of gem
55+
# The chosen-rails gem has broken CoffeeScript compilation on Rails 8.1
5556
gem 'commonmarker'
5657

5758
gem 'faraday'

Gemfile.lock

Lines changed: 0 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,6 @@ GIT
66
sitemap_generator (6.3.0)
77
builder (~> 3.0)
88

9-
GIT
10-
remote: https://github.com/olleolleolle/chosen-rails.git
11-
revision: cfef31cb30ed6d0dfd65cae0ff6f4a2943812df0
12-
branch: support-rails-8
13-
specs:
14-
chosen-rails (2.0.0)
15-
coffee-rails (>= 3.2)
16-
dartsass-rails (>= 0.5.0)
17-
railties (>= 3.0)
18-
199
GEM
2010
remote: https://rubygems.org/
2111
specs:
@@ -164,13 +154,6 @@ GEM
164154
logger (~> 1.5)
165155
cocoon (1.2.15)
166156
coderay (1.1.3)
167-
coffee-rails (5.0.0)
168-
coffee-script (>= 2.2.0)
169-
railties (>= 5.2.0)
170-
coffee-script (2.4.1)
171-
coffee-script-source
172-
execjs
173-
coffee-script-source (1.12.2)
174157
commonmarker (2.6.3-aarch64-linux)
175158
commonmarker (2.6.3-arm64-darwin)
176159
commonmarker (2.6.3-x86_64-darwin)
@@ -184,9 +167,6 @@ GEM
184167
css_parser (1.14.0)
185168
addressable
186169
csv (3.3.5)
187-
dartsass-rails (0.5.1)
188-
railties (>= 6.0.0)
189-
sass-embedded (~> 1.63)
190170
database_cleaner (2.1.0)
191171
database_cleaner-active_record (>= 2, < 3)
192172
database_cleaner-active_record (2.2.2)
@@ -234,18 +214,6 @@ GEM
234214
activerecord (>= 4.0.0)
235215
globalid (1.3.0)
236216
activesupport (>= 6.1)
237-
google-protobuf (4.33.2-aarch64-linux-gnu)
238-
bigdecimal
239-
rake (>= 13)
240-
google-protobuf (4.33.2-arm64-darwin)
241-
bigdecimal
242-
rake (>= 13)
243-
google-protobuf (4.33.2-x86_64-darwin)
244-
bigdecimal
245-
rake (>= 13)
246-
google-protobuf (4.33.2-x86_64-linux-gnu)
247-
bigdecimal
248-
rake (>= 13)
249217
haml (7.2.0)
250218
temple (>= 0.8.2)
251219
thor
@@ -548,14 +516,6 @@ GEM
548516
ruby-vips (2.3.0)
549517
ffi (~> 1.12)
550518
logger
551-
sass-embedded (1.97.0-aarch64-linux-gnu)
552-
google-protobuf (~> 4.31)
553-
sass-embedded (1.97.0-arm64-darwin)
554-
google-protobuf (~> 4.31)
555-
sass-embedded (1.97.0-x86_64-darwin)
556-
google-protobuf (~> 4.31)
557-
sass-embedded (1.97.0-x86_64-linux-gnu)
558-
google-protobuf (~> 4.31)
559519
sassc (2.4.0)
560520
ffi (~> 1.9)
561521
sassc-rails (2.1.2)
@@ -659,7 +619,6 @@ DEPENDENCIES
659619
capybara-playwright-driver
660620
carrierwave
661621
carrierwave-aws (~> 1.6)
662-
chosen-rails!
663622
cocoon
664623
commonmarker
665624
csv

app/assets/javascripts/application.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,14 @@
1010
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
1111
// about supported directives.
1212
//
13+
//= require jquery
1314
//= require popper
1415
//= require bootstrap
15-
//= require jquery
1616
//= require rails-ujs
1717
//= require activestorage
1818
//= require jquery-ui
1919
//= require autocomplete-rails
20-
//= require chosen-jquery
20+
//= require chosen.jquery
2121
//= require 'jsimple-star-rating.min.js'
2222
//= require pickadate/picker
2323
//= require pickadate/picker.date
@@ -59,12 +59,12 @@ $(function() {
5959
}).show();
6060
});
6161

62-
$('select').chosen(function(){
63-
allow_single_deselect: true
62+
$('select').chosen({
63+
allow_single_deselect: true,
6464
no_results_text: 'No results matched'
6565
});
6666

67-
$('#member_lookup_id').chosen().change(function(e) {
67+
$('#member_lookup_id').change(function(e) {
6868
$('#view_profile').attr('href', '/admin/members/' + $(this).val())
6969
});
7070

app/views/admin/members/index.html.haml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
%h1 Members Directory
55
.row.mb-4
66
.col-12.col-md-6
7-
= select_tag 'member_lookup_id', options_for_select(@members.collect{ |u| ["#{u.full_name} (#{u.email})", u.id] }), { class: 'chosen-select' }
7+
= select_tag 'member_lookup_id', options_for_select([['Select a member...', '']] + @members.collect{ |u| ["#{u.full_name} (#{u.email})", u.id] }), { class: 'chosen-select' }
88
.row
99
.col
1010
= link_to 'View Profile', '#', { class: 'btn btn-primary', id: 'view_profile' }
538 Bytes
Loading
738 Bytes
Loading

0 commit comments

Comments
 (0)