@data-fair/dev-server 2.6.1 → 2.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-fair/dev-server",
-  "version": "2.6.1",
+  "version": "2.6.3",
   "description": "A development server for optimal development experience of data-fair applications.",
   "main": "src/index.js",
   "bin": {

package/src/app.js

@@ -425,7 +425,12 @@ app.use('/app', createProxyMiddleware({
                         catch (err) {
                             console.warn('[dev-server] failed to enrich configuration datasets', err);
                         }
-                        const filledBody = output.replace(/%APPLICATION%/g, JSON.stringify({
+                        // Same substitution as data-fair's proxy (api/src/applications/proxy.ts), on purpose:
+                        // anchored on the assignment the contract defines rather than on the bare placeholder,
+                        // so an application naming %APPLICATION% elsewhere (a comment documenting the contract)
+                        // does not consume it — and with < / > escaped so no string of the application can
+                        // close the script or a comment. An application that loads here must load there.
+                        const applicationJson = JSON.stringify({
                             id: 'dev-application',
                             slug: 'dev-application',
                             title: 'Dev application',
@@ -437,7 +442,8 @@ app.use('/app', createProxyMiddleware({
                             apiUrl: `http://localhost:${config.port}/data-fair/api/v1`,
                             wsUrl: `ws://localhost:${config.port}/data-fair`,
                             owner: config.dataFair && config.dataFair.owner
-                        }));
+                        }).replace(/</g, '\\u003C').replace(/>/g, '\\u003E');
+                        const filledBody = output.replace(/window\.APPLICATION\s*=\s*%APPLICATION%/g, () => `window.APPLICATION=${applicationJson}`);
                         const document = parse5.parse(filledBody);
                         const html = document.childNodes.filter(isElementNode).find(c => c.tagName === 'html');
                         if (!html)
@@ -446,6 +452,17 @@ app.use('/app', createProxyMiddleware({
                         const bodyNode = html.childNodes.filter(isElementNode).find(c => c.tagName === 'body');
                         if (!headNode || !bodyNode)
                             throw new Error('HTML structure is broken, expect html, head and body elements');
+                        // data-fair owns the language and the title of the served document (proxy.ts): it
+                        // replaces whatever the application declares, because a <title> declared by an
+                        // application names its model in the catalog, not the visualization being served, and
+                        // a document with no language — or the wrong one — fails WCAG 3.1.1 / 2.4.2. Doing it
+                        // here too means a developer sees the document production will actually serve.
+                        html.attrs = (html.attrs ?? []).filter(attr => attr.name !== 'lang');
+                        html.attrs.push({ name: 'lang', value: config.lang?.default ?? 'fr' });
+                        headNode.childNodes = headNode.childNodes.filter(c => !isElementNode(c) || c.tagName !== 'title');
+                        const titleNode = createElement('title');
+                        appendChild(titleNode, createTextNode('Dev application'));
+                        headNode.childNodes.push(titleNode);
                         const meta = {};
                         for (const node of headNode.childNodes.filter(isElementNode)) {
                             if (node.tagName === 'meta') {

package/src/enrich.d.ts

@@ -1,4 +1,4 @@
-export declare const INJECTED_DATASET_PROPS: readonly ["id", "href", "page", "title", "slug", "finalizedAt", "schema", "isRest", "userPermissions"];
+export declare const INJECTED_DATASET_PROPS: readonly ["id", "href", "page", "title", "slug", "finalizedAt", "schema", "isRest", "userPermissions", "bbox", "timePeriod", "attachmentsAsImage", "count"];
 export declare const enrichDataset: (dataset: any, fetchJson: (path: string) => Promise<any>) => Promise<any>;
 export interface PrepareConfigDeps {
     fetchJson: (path: string) => Promise<any>;

package/src/enrich.js

@@ -13,12 +13,18 @@
 const datasetsCache = new Map();
 const DATASETS_CACHE_TTL = 30_000;
 // The set of properties data-fair injects in a configuration dataset entry. Sticking to it
-// matters: forwarding the whole remote dataset would let an application rely, in dev, on a
-// property that production never sends. data-fair refreshes the keys stored in the entry plus
-// the `select` of the app's config schema dataset selector — this list covers that contract,
-// including `isRest`, carried by the select of editing apps and used as the gate deciding
-// whether rest line editing (POST/PATCH/DELETE /lines) is offered at all.
-export const INJECTED_DATASET_PROPS = ['id', 'href', 'page', 'title', 'slug', 'finalizedAt', 'schema', 'isRest', 'userPermissions'];
+// matters in both directions: forwarding the whole remote dataset would let an application rely,
+// in dev, on a property production never sends — and omitting one production does send makes an
+// application work in production and not here, which is worse still.
+//
+// data-fair derives the set per request (refreshConfigDatasetsRefs, api/src/applications/utils.ts):
+// the keys already stored in the entry, plus `finalizedAt` and `slug`, plus the `select` of the
+// dataset selector declared in the application's own config schema. We cannot derive it without
+// parsing that schema, so this list mirrors it and has to track it: it is the union of the
+// selects used by the published applications. `isRest` gates whether rest line editing
+// (POST/PATCH/DELETE /lines) is offered at all; `bbox` and `timePeriod` drive the initial map
+// bounds and period pickers; `attachmentsAsImage` switches list apps to thumbnail mode.
+export const INJECTED_DATASET_PROPS = ['id', 'href', 'page', 'title', 'slug', 'finalizedAt', 'schema', 'isRest', 'userPermissions', 'bbox', 'timePeriod', 'attachmentsAsImage', 'count'];
 export const enrichDataset = async (dataset, fetchJson) => {
     if (!dataset?.id)
         return dataset;