{"record":{"id":"d924b1a77c55cc15","repo":"framework7io/framework7","slug":"attempting-to-extend-color-originalcolor-name-w","errorCode":null,"errorMessage":"Attempting to extend color ${originalColor.name} with color ${extendedColor.name} of different name for spec version ${specVersion}.","messagePattern":"Attempting to extend color (.+?) with color (.+?) of different name for spec version (.+?)\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/core/shared/material-color-utils.js","lineNumber":396,"sourceCode":"  }\n  static darkerUnsafe(tone, ratio) {\n    const darkerSafe = Contrast.darker(tone, ratio);\n    return darkerSafe < 0 ? 0 : darkerSafe;\n  }\n}\n\nclass DislikeAnalyzer {\n  static isDisliked(hct) {\n    const huePasses = Math.round(hct.hue) >= 90 && Math.round(hct.hue) <= 111, chromaPasses = Math.round(hct.chroma) > 16, tonePasses = Math.round(hct.tone) < 65;\n    return huePasses && chromaPasses && tonePasses;\n  }\n  static fixIfDisliked(hct) {\n    return DislikeAnalyzer.isDisliked(hct) ? Hct.from(hct.hue, hct.chroma, 70) : hct;\n  }\n}\n\nfunction validateExtendedColor(originalColor, specVersion, extendedColor) {\n  if (originalColor.name !== extendedColor.name) throw new Error(`Attempting to extend color ${originalColor.name} with color ${extendedColor.name} of different name for spec version ${specVersion}.`);\n  if (originalColor.isBackground !== extendedColor.isBackground) throw new Error(`Attempting to extend color ${originalColor.name} as a ${originalColor.isBackground ? \"background\" : \"foreground\"} with color ${extendedColor.name} as a ${extendedColor.isBackground ? \"background\" : \"foreground\"} for spec version ${specVersion}.`);\n}\n\nfunction extendSpecVersion(originlColor, specVersion, extendedColor) {\n  return validateExtendedColor(originlColor, specVersion, extendedColor), DynamicColor.fromPalette({\n    name: originlColor.name,\n    palette: s => s.specVersion === specVersion ? extendedColor.palette(s) : originlColor.palette(s),\n    tone: s => s.specVersion === specVersion ? extendedColor.tone(s) : originlColor.tone(s),\n    isBackground: originlColor.isBackground,\n    chromaMultiplier: s => {\n      const chromaMultiplier = s.specVersion === specVersion ? extendedColor.chromaMultiplier : originlColor.chromaMultiplier;\n      return void 0 !== chromaMultiplier ? chromaMultiplier(s) : 1;\n    },\n    background: s => {\n      const background = s.specVersion === specVersion ? extendedColor.background : originlColor.background;\n      return void 0 !== background ? background(s) : void 0;\n    },\n    secondBackground: s => {","sourceCodeStart":378,"sourceCodeEnd":414,"githubUrl":"https://github.com/framework7io/framework7/blob/655759126686766530a027b2f8f369c991d63d1c/src/core/shared/material-color-utils.js#L378-L414","documentation":"Material Design color system's validateExtendedColor asserts that, when extending a DynamicColor for a specific spec version, the extended color carries the same name as the original. A mismatch means the spec-version extension table is inconsistent. This is a programming/data error in the color spec definitions, not user input.","triggerScenarios":"Calling MaterialDynamicColors extension machinery (extendSpecVersion) where the extended color for a spec version has a name differing from the original color's name.","commonSituations":"Hand-editing or partially copying the color spec tables; merging upstream color-utils versions so a color's spec-2025 counterpart was renamed; adding a new spec version entry with a wrong name field.","solutions":["Make extendedColor.name match originalColor.name for every spec-version entry.","Restore the original color definition entries from upstream material-color-utils.","If a color was intentionally renamed, rename it consistently across all spec versions and all consumers.","Add a test extending every color across all spec versions to catch mismatches early."],"exampleFix":"// before\nextendSpecVersion(color, specVersion, { name: 'surface_dim', ... });\n// after\nextendSpecVersion(color, specVersion, { name: color.name, ... });","handlingStrategy":"validation","validationCode":"function validateNames(originalColor, extendedColor, specVersion) {\n  if (originalColor.name !== extendedColor.name) {\n    throw new Error(`spec ${specVersion}: expected extension named ${originalColor.name}, got ${extendedColor.name}`);\n  }\n}\n// run for every color at module load: colors.forEach(c => validateNames(c, spec2025[c.name], '2025'))","typeGuard":"function extensionMatchesOriginal(original, extended) {\n  return extended.name === original.name;\n}","tryCatchPattern":"try {\n  const result = extendSpecVersion(color, specVersion, ext);\n} catch (err) {\n  if (/different name for spec version/.test(err.message)) {\n    ext = { ...ext, name: color.name };\n  } else throw err;\n}","preventionTips":["Never hand-copy DynamicColor entries; derive spec-version extensions from the original color.","Keep all spec-version tables generated from one source of truth.","Add a startup test extending every color across all spec versions."],"tags":["material-design","color","spec-version","invariant"],"backgroundTag":"color-spec-name-mismatch","analyzedSha":"655759126686766530a027b2f8f369c991d63d1c","analyzedAt":"2026-09-02T19:48:40.711Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-10T02:17:09.455Z"}