Remove jQuery dependency and replace with vanilla JavaScript #385
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR completely removes the jQuery dependency from the vector-map demo application, replacing all jQuery functionality with modern vanilla JavaScript while maintaining 100% backward compatibility and functionality.
Problem
The application was using jQuery 3.4.1 and Bootstrap 3.4.1, which:
Solution
Systematically replaced all jQuery usage with vanilla JavaScript:
Core Changes
$()selectors withdocument.querySelector()andquerySelectorAll()$.on()to nativeaddEventListener()$.extend()withObject.assign()fetch()APISearch Functionality Modernization
The search system was completely rewritten to eliminate the jQuery-dependent typeahead.js library:
Created two new components:
SimpleAutocomplete: Modern autocomplete with keyboard navigation, highlighting, and custom templatesOpenMapSearchEngine: Vanilla JS search engine with EventTarget-based eventsBootstrap Replacement
Removed Bootstrap 3.4.1 dependency and created minimal CSS replacement (
bootstrap-replacement.css) that only includes the specific grid and form classes actually used by the application.Code Cleanup
Removed all legacy jQuery compatibility code including:
searchEngine.addEventListenervssearchEngine.bindFiles Changed
demo/map.js- Complete jQuery to vanilla JS conversion, removed fallback codedemo/search/simple-autocomplete.js(NEW) - Modern autocomplete componentdemo/search/openmap-search-engine.js(NEW) - Vanilla JS search engine, cleaned of legacy methodsdemo/search/search.js- Updated to use new componentsdemo/bootstrap-replacement.css(NEW) - Minimal CSS for layoutFiles Removed
demo/vendor/jquery-3.4.1.min.jsdemo/vendor/bootstrap-3.4.1.min.cssdemo/search/typeahead.bundle.jsdemo/search/typeahead-openmap.jsdemo/search/typeahead-address-photon.jsTesting Results
All functionality verified working across all demo pages:
Screenshots
Main Map Page
Beer Map with Filter Controls
Benefits
Code Quality
The migration is complete with zero functional regressions while significantly modernizing the codebase and removing all legacy compatibility code.
Original prompt
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.