🎙️ a11y: update html lang attribute (#3636)

* refactor: remove duplicate localStorage lang call

* refactor: use cookies to handle langcode

* feat: override index.html lang w/ cookie pref

* refactor: only read index on server start

* refactor: rename lang cookie & localstorage as backup

* refactor: use atomWithLocalStorage in language store

* fix: forced reflow warning in language select
This commit is contained in:
Jacob Colyvan 2024-08-30 20:57:29 +10:00 committed by GitHub
parent a0042317b2
commit 2ce4f66218
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 71 additions and 19 deletions

View file

@ -7,6 +7,8 @@ const express = require('express');
const compression = require('compression');
const passport = require('passport');
const mongoSanitize = require('express-mongo-sanitize');
const fs = require('fs');
const cookieParser = require('cookie-parser');
const { jwtLogin, passportLogin } = require('~/strategies');
const { connectDb, indexSync } = require('~/lib/db');
const { isEnabled } = require('~/server/utils');
@ -37,6 +39,9 @@ const startServer = async () => {
app.disable('x-powered-by');
await AppService(app);
const indexPath = path.join(app.locals.paths.dist, 'index.html');
const indexHTML = fs.readFileSync(indexPath, 'utf8');
app.get('/health', (_req, res) => res.status(200).send('OK'));
/* Middleware */
@ -50,6 +55,7 @@ const startServer = async () => {
app.use(staticCache(app.locals.paths.assets));
app.set('trust proxy', 1); /* trust first proxy */
app.use(cors());
app.use(cookieParser());
if (!isEnabled(DISABLE_COMPRESSION)) {
app.use(compression());
@ -101,8 +107,12 @@ const startServer = async () => {
app.use('/api/roles', routes.roles);
app.use('/api/tags', routes.tags);
app.use((req, res) => {
res.sendFile(path.join(app.locals.paths.dist, 'index.html'));
// Replace lang attribute in index.html with lang from cookies or accept-language header
const lang = req.cookies.lang || req.headers['accept-language']?.split(',')[0] || 'en-US';
const updatedIndexHtml = indexHTML.replace(/lang="en-US"/g, `lang="${lang}"`);
res.send(updatedIndexHtml);
});
app.listen(port, host, () => {