Merge pull request #10070 from tchak/remove-vite-legacy

chore(js): remove vite legacy build

app/helpers/application_helper.rb

@@ -126,14 +126,6 @@ module ApplicationHelper
     !BrowserSupport.supported?(browser)
   end
 
-  def vite_legacy?
-    if ENV['VITE_LEGACY'] == 'disabled'
-      false
-    else
-      Rails.env.production? || ENV['VITE_LEGACY'] == 'enabled'
-    end
-  end
-
   def external_link_attributes
     { target: "_blank", rel: "noopener noreferrer" }
   end

app/helpers/vite_helper.rb

@@ -1,35 +0,0 @@
-module ViteHelper
-  # This module is a port of code in @vitejs/plugin-legacy. We need it because ruby vite_plugin_legacy
-  # has ommited to implement this logic. Original code here:
-  # https://github.com/vitejs/vite/blob/722f5148ea494cdc15379d3a98dca0751131ca22/packages/plugin-legacy/src/index.ts#L408-L532
-
-  SAFARI_10_NO_MODULE_FIX = "!function(){var e=document,t=e.createElement('script');if(!('noModule'in t)&&'onbeforeload'in t){var n=!1;e.addEventListener('beforeload',(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute('nomodule')||!n)return;e.preventDefault()}),!0),t.type='module',t.src='.',e.head.appendChild(t),t.remove()}}();"
-
-  LEGACY_POLYFILL_ID = 'vite-legacy-polyfill'
-  LEGACY_ENTRY_ID = 'vite-legacy-entry'
-  SYSTEM_JS_INLINE_CODE = "document.querySelectorAll('script[data-legacy-entry]').forEach((e) => System.import(e.getAttribute('data-src')))"
-
-  DETECT_MODERN_BROWSER_VARNAME = '__vite_is_modern_browser'
-  DETECT_MODERN_BROWSER_CODE = "try{import.meta.url;import('_').catch(()=>1);}catch(e){}window.#{DETECT_MODERN_BROWSER_VARNAME}=true;"
-  DYNAMIC_FALLBACK_INLINE_CODE = "!function(){if(window.#{DETECT_MODERN_BROWSER_VARNAME})return;console.warn('vite: loading legacy build because dynamic import or import.meta.url is unsupported, syntax error above should be ignored');var e=document.getElementById('#{LEGACY_POLYFILL_ID}'),n=document.createElement('script');n.src=e.src,n.onload=function(){#{SYSTEM_JS_INLINE_CODE}},document.body.appendChild(n)}();"
-
-  def vite_legacy_javascript_tag(name, asset_type: :javascript)
-    legacy_name = name.sub(/(\..+)|$/, '-legacy\1')
-    src = vite_asset_path(legacy_name, type: :virtual)
-    javascript_include_tag(src, nomodule: true, 'data-legacy-entry': true, 'data-src': src)
-  end
-
-  def vite_legacy_polyfill_tag
-    safe_join [
-      javascript_tag(SAFARI_10_NO_MODULE_FIX, type: :module, nonce: true),
-      javascript_include_tag(vite_asset_path('legacy-polyfills', type: :virtual), nomodule: true, id: LEGACY_POLYFILL_ID)
-    ]
-  end
-
-  def vite_legacy_fallback_tag
-    safe_join [
-      javascript_tag(DETECT_MODERN_BROWSER_CODE, type: :module, nonce: true),
-      javascript_tag(DYNAMIC_FALLBACK_INLINE_CODE, type: :module, nonce: true)
-    ]
-  end
-end

app/javascript/entrypoints/application.js

@@ -48,12 +48,5 @@ Turbo.session.drive = false;
 // Expose globals
 window.DS = window.DS || DS;
 
-// enable legacy mode of DSFR when vite is not detectde as modern browser
-window.addEventListener('load', function () {
-  if (!window.__vite_is_modern_browser) {
-    window.dsfr.internals.legacy.setLegacy();
-  }
-});
-
 import('../shared/track/matomo');
 import('../shared/track/sentry');

app/views/layouts/_outdated_browser_banner.html.haml

@@ -1,9 +1,7 @@
 - if show_outdated_browser_banner?
   = render Dsfr::AlertComponent.new(state: :warning, title: "Navigateur trop ancien", heading_level: :h2) do |c|
     - c.with_body do
-      Votre navigateur internet, #{browser.name} #{browser.version}, est malheureusement trop ancien. Il ne sera plus compatible avec #{APPLICATION_NAME} à partir du 
-      %strong
-        1 juin 2024.
+      Votre navigateur internet, #{browser.name} #{browser.version}, est malheureusement trop ancien. Il n’est plus compatible avec #{APPLICATION_NAME}.
       %br
       Veuillez installer un navigateur plus récent en suivant le lien suivant :
       %br

app/views/layouts/application.html.haml

@@ -22,13 +22,6 @@
     - if administrateur_signed_in?
       = vite_javascript_tag 'track-admin'
 
-    - if vite_legacy?
-      = vite_legacy_polyfill_tag
-      = vite_legacy_javascript_tag 'application'
-      - if administrateur_signed_in?
-        = vite_legacy_javascript_tag 'track-admin'
-      = vite_legacy_fallback_tag
-
     = preload_link_tag(asset_url("Marianne-Regular.woff2"))
     = preload_link_tag(asset_url("Spectral-Regular.ttf"))
 

config/env.example.optional

@@ -154,10 +154,6 @@ DOLIST_API_BALANCING_VALUE="50"
 # Used only by a migration to choose your default regarding procedure archive dossiers after duree_conservation_dossiers_dans_ds
 # DEFAULT_PROCEDURE_EXPIRES_WHEN_TERMINE_ENABLED=true
 
-# Enable vite legacy build (IE11). Legacy build is used in production (except if set to "disabled").
-# You might want to enable it in other environements for testing. Build time will be greatly impacted.
-VITE_LEGACY=""
-
 # around july 2022, we changed the duree_conservation_dossiers_dans_ds, allow instances to choose their own duration
 NEW_MAX_DUREE_CONSERVATION=12
 

package.json

@@ -20,7 +20,6 @@
     "@reach/combobox": "^0.17.0",
     "@reach/slider": "^0.17.0",
     "@sentry/browser": "7.107.0",
-    "@stimulus/polyfills": "^2.0.0",
     "@tiptap/core": "^2.2.4",
     "@tiptap/extension-bold": "^2.2.4",
     "@tiptap/extension-bullet-list": "^2.2.4",
@@ -47,13 +46,11 @@
     "core-js": "^3.31.0",
     "date-fns": "^2.30.0",
     "debounce": "^1.2.1",
-    "dom4": "^2.1.6",
     "email-butler": "^1.0.13",
     "geojson": "^0.5.0",
     "graphiql": "^3.1.1",
     "graphql": "^16.8.1",
     "highcharts": "^10.3.3",
-    "intersection-observer": "^0.12.2",
     "is-hotkey": "^0.2.0",
     "lightgallery": "^2.7.2",
     "maplibre-gl": "^1.15.2",
@@ -70,10 +67,7 @@
     "tiny-invariant": "^1.3.3",
     "tippy.js": "^6.3.7",
     "trix": "^1.2.3",
-    "turbo-polyfills": "^0.5.0",
     "use-debounce": "^9.0.4",
-    "whatwg-fetch": "^3.6.20",
-    "yet-another-abortcontroller-polyfill": "^0.0.4",
     "zod": "^3.20.2"
   },
   "devDependencies": {
@@ -94,7 +88,6 @@
     "@types/sortablejs": "^1.15.8",
     "@typescript-eslint/eslint-plugin": "^6.13.1",
     "@typescript-eslint/parser": "^6.13.1",
-    "@vitejs/plugin-legacy": "^5.2.0",
     "@vitejs/plugin-react": "^4.2.0",
     "autoprefixer": "^10.4.19",
     "axe-core": "^4.8.4",
@@ -111,7 +104,7 @@
     "vite": "^5.0.12",
     "vite-plugin-full-reload": "^1.1.0",
     "vite-plugin-ruby": "^5.0.0",
-    "vitest": "^0.34.6"
+    "vitest": "^1.3.1"
   },
   "scripts": {
     "clean": "del tmp public/graphql && bin/vite clobber",

spec/system/outdated_browser_spec.rb

@@ -7,7 +7,7 @@ describe 'Outdated browsers support:' do
 
     scenario 'a banner is displayed' do
       visit new_user_session_path
-      expect(page).to have_content('1 juin 2024')
+      expect(page).to have_content('Il n’est plus compatible avec')
       expect(page).to have_content('Votre navigateur internet, Internet Explorer 10, est malheureusement trop ancien')
     end
   end

vite.config.ts

@@ -1,8 +1,7 @@
 import { defineConfig } from 'vite';
 import ViteReact from '@vitejs/plugin-react';
-import ViteLegacy from '@vitejs/plugin-legacy';
-import FullReload from 'vite-plugin-full-reload';
 import RubyPlugin from 'vite-plugin-ruby';
+import FullReload from 'vite-plugin-full-reload';
 
 const plugins = [
   RubyPlugin(),
@@ -13,45 +12,8 @@ const plugins = [
   )
 ];
 
-if (shouldBuildLegacy()) {
-  plugins.push(
-    ViteLegacy({
-      targets: [
-        'defaults',
-        'Chrome >= 50',
-        'Edge >= 14',
-        'Firefox >= 50',
-        'Opera >= 40',
-        'Safari >= 8',
-        'iOS >= 8',
-        'IE >= 11'
-      ],
-      additionalLegacyPolyfills: [
-        'dom4',
-        'core-js/stable',
-        '@stimulus/polyfills',
-        'turbo-polyfills',
-        'intersection-observer',
-        'regenerator-runtime/runtime',
-        'whatwg-fetch',
-        'yet-another-abortcontroller-polyfill'
-      ]
-    })
-  );
-}
-
 export default defineConfig({
   resolve: { alias: { '@utils': '/shared/utils.ts' } },
   build: { sourcemap: true, assetsInlineLimit: 0 },
   plugins
 });
-
-function shouldBuildLegacy() {
-  if (process.env.VITE_LEGACY == 'disabled') {
-    return false;
-  }
-  return (
-    process.env.RAILS_ENV == 'production' ||
-    process.env.VITE_LEGACY == 'enabled'
-  );
-}