Ignore spec colors we don't recognize.

lib/__snapshots__/vocabulary-builder.test.ts.snap

@@ -1,5 +1,23 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`convertSvgMarkupToSymbolData() processes specs 1`] = `
+Object {
+  "anchor": Array [
+    Object {
+      "normal": Object {
+        "x": 0,
+        "y": -1,
+      },
+      "point": Object {
+        "t": 0,
+        "x": 360,
+        "y": 701.804,
+      },
+    },
+  ],
+}
+`;
+
 exports[`convertSvgMarkupToSymbolData() works with SVGs that just have a path and no specs 1`] = `
 Object {
   "bbox": Object {

lib/specs.ts

@@ -141,7 +141,11 @@ function updateSpecs(fill: string, path: string, specs: Specs): Specs {
     };
   }
 
-  throw new Error(`Not sure what to do with specs path with fill "${fill}"!`);
+  console.log(
+    `Not sure what to do with specs path with fill "${fill}", ignoring it.`
+  );
+
+  return specs;
 }
 
 function getSpecs(layers: SvgSymbolElement[]): Specs {

lib/vocabulary-builder.test.ts

@@ -2,10 +2,47 @@ import { convertSvgMarkupToSymbolData } from "./vocabulary-builder";
 
 const CIRCLE = `<path fill="#ffffff" fill-rule="evenodd" stroke="#000000" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" d="M 360.000 29.751 C 542.791 29.751 690.249 177.209 690.249 360.000 C 690.249 542.791 542.791 690.249 360.000 690.249 C 177.209 690.249 29.751 542.791 29.751 360.000 C 29.751 177.209 177.209 29.751 360.000 29.751 Z"/>`;
 
+function arrow(color: string) {
+  return `<path fill="${color}" fill-rule="evenodd" stroke="none" d="M 360.000 679.153 C 360.001 679.156 372.114 713.074 372.116 713.077 C 372.114 713.076 360.001 701.805 360.000 701.804 C 359.999 701.805 347.886 713.076 347.884 713.077 C 347.886 713.074 359.999 679.156 360.000 679.153 Z"/>`;
+}
+
+function withMockConsoleLog(fn: (mock: jest.Mock) => void) {
+  const originalLog = console.log;
+  const mockLog = jest.fn();
+  console.log = mockLog;
+  try {
+    fn(mockLog);
+  } finally {
+    console.log = originalLog;
+  }
+}
+
 describe("convertSvgMarkupToSymbolData()", () => {
   it("works with SVGs that just have a path and no specs", () => {
     expect(
       convertSvgMarkupToSymbolData("blarg.svg", `<svg>${CIRCLE}</svg>`)
     ).toMatchSnapshot();
   });
+
+  it("processes specs", () => {
+    const result = convertSvgMarkupToSymbolData(
+      "blarg.svg",
+      `<svg>${CIRCLE}<g id="specs">${arrow("#ff0000")}</g></svg>`
+    );
+    expect(result.specs?.anchor).toHaveLength(1);
+    expect(result.specs).toMatchSnapshot();
+  });
+
+  it("ignores colors in specs it doesn't understand", () => {
+    withMockConsoleLog((mockLog) => {
+      const result = convertSvgMarkupToSymbolData(
+        "blarg.svg",
+        `<svg>${CIRCLE}<g id="specs">${arrow("#f1f1f1")}</g></svg>`
+      );
+      expect(result.specs).toEqual({});
+      expect(mockLog).toHaveBeenCalledWith(
+        'Not sure what to do with specs path with fill "#f1f1f1", ignoring it.'
+      );
+    });
+  });
 });