@annotorious/annotorious 3.8.2 → 3.8.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@annotorious/annotorious",
-  "version": "3.8.2",
+  "version": "3.8.4",
   "description": "Add image annotation functionality to any web page with a few lines of JavaScript",
   "author": "Rainer Simon",
   "license": "BSD-3-Clause",
@@ -46,16 +46,16 @@
     "@sveltejs/vite-plugin-svelte": "^3.1.2",
     "@tsconfig/svelte": "^5.0.8",
     "@types/rbush": "^4.0.0",
-    "jsdom": "^29.1.0",
+    "jsdom": "^29.1.1",
     "svelte": "^4.2.20",
-    "svelte-preprocess": "^6.0.3",
+    "svelte-preprocess": "^6.0.5",
     "typescript": "^5.9.3",
     "vite": "^5.4.21",
     "vite-plugin-dts": "^4.5.4",
-    "vitest": "^3.2.4"
+    "vitest": "^3.2.6"
   },
   "dependencies": {
-    "@annotorious/core": "3.8.2",
+    "@annotorious/core": "3.8.4",
     "dequal": "^2.0.3",
     "rbush": "^4.0.1",
     "simplify-js": "^1.2.4",

package/src/model/w3c/W3CImageFormatAdapter.ts

@@ -33,6 +33,22 @@ export const W3CImageFormat = (
   return { parse, serialize }
 }
 
+const isSupportedSelector = (selector: any): boolean =>
+  selector?.type === 'SvgSelector' ||
+  selector?.type === 'FragmentSelector' ||
+  isFragmentSelector(selector);
+
+const isSupportedTarget = (target: any): boolean => {
+  if (typeof target === 'string')
+    return isFragmentSelector(target); // Plain string fragment selector
+
+  const selector = Array.isArray(target.selector)
+    ? target.selector.find(isSupportedSelector)
+    : target.selector;
+
+  return isSupportedSelector(selector);
+}
+
 export const parseW3CImageAnnotation = (
   annotation: W3CAnnotation, 
   opts: W3CImageFormatAdapterOpts = { strict: true, invertY: false }
@@ -49,8 +65,15 @@ export const parseW3CImageAnnotation = (
 
   const bodies = parseW3CBodies(body || [], annotationId);
 
-  const w3cTarget = Array.isArray(annotation.target) 
-    ? annotation.target[0] : annotation.target;
+  const w3cTarget = Array.isArray(annotation.target)
+    ? annotation.target.find(isSupportedTarget)
+    : annotation.target;
+
+  if (!w3cTarget) {
+    return {
+      error: Error(`Unsupported target(s): ${JSON.stringify(w3cTarget)}`)
+    };
+  }
 
   const w3cSelector = 
     typeof w3cTarget === 'string' ? w3cTarget :

package/src/model/w3c/fragment/FragmentSelector.ts

@@ -11,6 +11,10 @@ export interface FragmentSelector {
 
 }
 
+const number = '-?\\d+(?:\\.\\d+)?(?:[eE][+-]?\\d+)?';
+
+const MAX_FRAGMENT_LENGTH = 512; // ReDoS guard
+
 export const isFragmentSelector = (
   selector: any
 ): boolean => {
@@ -18,10 +22,15 @@ export const isFragmentSelector = (
     return true;
 
   if (typeof selector === 'string') {
+    if (selector.length > MAX_FRAGMENT_LENGTH) return false;
+
     const hashIndex = selector.indexOf('#');
     if (hashIndex < 0) return false;
 
-    const xywh = /#xywh(?:=(?:pixel:|percent:)?)(.+?),(.+?),(.+?),(.+)$/i;
+    const xywh = new RegExp(
+      `#xywh=((?:pixel|percent):)?(${number}),(${number}),(${number}),(${number})$`,
+      'i');
+
     return xywh.test(selector);
   }
 
@@ -35,8 +44,13 @@ export const parseFragmentSelector = (
   const fragment =
     typeof fragmentOrSelector === 'string' ? fragmentOrSelector : fragmentOrSelector.value;
 
-  const regex = /(xywh)=(?:(pixel|percent):)?:?(.+?),(.+?),(.+?),(.+)*/g;
-  const matches = [...fragment.matchAll(regex)][0];
+  if (fragment.length > MAX_FRAGMENT_LENGTH) throw new Error('Fragment too long: ' + fragment);
+
+  const regex = new RegExp(
+    `(xywh)=((?:pixel|percent))?:?(${number}),(${number}),(${number}),(${number})$`,
+  );
+  
+  const matches = regex.exec(fragment);
 
   if (!matches) throw new Error('Not a MediaFragment: ' + fragment);
 

package/src/model/w3c/svg/SVG.ts

@@ -37,7 +37,13 @@ export const insertSVGNamespace = (originalDoc: Document): Element => {
 export const parseSVGXML = (value: string): Element => {
   const parser = new DOMParser();
 
-  const doc = parser.parseFromString(value, 'image/svg+xml');
+  // Parser assumes an <svg /> root element, but W3C spec also 
+  // allows just the shape element, without SVG doc.
+  const wrapped = value.trimStart().startsWith('<svg')
+    ? value
+    : `<svg xmlns="${SVG_NAMESPACE}">${value}</svg>`;
+
+  const doc = parser.parseFromString(wrapped, 'image/svg+xml');
 
   // SVG needs a namespace declaration - check if it's set or insert if not
   const isPrefixDeclared = doc.lookupPrefix(SVG_NAMESPACE); // SVG declared via prefix

package/src/model/w3c/svg/pathParser.ts

@@ -163,7 +163,6 @@ const parsePathCommands = (d: string) => {
   const commands: PathCommand[] = [];
   const cleanPath = d.replace(/,/g, ' ').trim();
   
-  // Updated regex to include H and V commands
   const commandRegex = /([MmLlHhVvCcZz])\s*([^MmLlHhVvCcZz]*)/g;
   let match;
   
@@ -171,12 +170,33 @@ const parsePathCommands = (d: string) => {
     const [, commandLetter, argsString] = match;
     const args = argsString.trim() === '' ? [] : 
       argsString.trim().split(/\s+/).map(Number).filter(n => !isNaN(n));
-    
-    commands.push({
-      type: commandLetter,
-      args
-    });
+
+    const step = argStep(commandLetter);
+
+    if (step === 0 || args.length <= step) {
+      // Z or single-instance command
+      commands.push({ type: commandLetter, args });
+    } else {
+      // Repeated commands
+      for (let i = 0; i < args.length; i += step) {
+        const impliedType = i === 0 ? commandLetter
+          : commandLetter === 'M' ? 'L'
+          : commandLetter === 'm' ? 'l'
+          : commandLetter;
+        commands.push({ type: impliedType, args: args.slice(i, i + step) });
+      }
+    }
   }
   
   return commands;
+}
+
+const argStep = (cmd: string): number => {
+  switch (cmd.toUpperCase()) {
+    case 'M': case 'L': return 2;
+    case 'H': case 'V': return 1;
+    case 'C': return 6;
+    case 'Z': return 0;
+    default:  return 2;
+  }
 }