{"record":{"id":"236e415b5ccd460c","repo":"videojs/video.js","slug":"illegal-component-name-name-must-be-a-non-e","errorCode":null,"errorMessage":"Illegal component name, \"${name}\"; must be a non-empty string.","messagePattern":"Illegal component name, \"(.+?)\"; must be a non-empty string\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/js/component.js","lineNumber":1990,"sourceCode":"   * > NOTE: {@link Tech}s should not be registered as a `Component`. {@link Tech}s\n   *         should be registered using {@link Tech.registerTech} or\n   *         {@link videojs:videojs.registerTech}.\n   *\n   * > NOTE: This function can also be seen on videojs as\n   *         {@link videojs:videojs.registerComponent}.\n   *\n   * @param {string} name\n   *        The name of the `Component` to register.\n   *\n   * @param {Component} ComponentToRegister\n   *        The `Component` class to register.\n   *\n   * @return {Component}\n   *         The `Component` that was registered.\n   */\n  static registerComponent(name, ComponentToRegister) {\n    if (typeof name !== 'string' || !name) {\n      throw new Error(`Illegal component name, \"${name}\"; must be a non-empty string.`);\n    }\n\n    const Tech = Component.getComponent('Tech');\n\n    // We need to make sure this check is only done if Tech has been registered.\n    const isTech = Tech && Tech.isTech(ComponentToRegister);\n    const isComp = Component === ComponentToRegister ||\n      Component.prototype.isPrototypeOf(ComponentToRegister.prototype);\n\n    if (isTech || !isComp) {\n      let reason;\n\n      if (isTech) {\n        reason = 'techs must be registered using Tech.registerTech()';\n      } else {\n        reason = 'must be a Component subclass';\n      }\n","sourceCodeStart":1972,"sourceCodeEnd":2008,"githubUrl":"https://github.com/videojs/video.js/blob/c3a7e0e6d20cf5400c9afbee29965fe4dff393c2/src/js/component.js#L1972-L2008","documentation":"registerComponent guards its name argument: it must be a non-empty string. Names are used as registry keys and TitleCased for lookup, so empty/non-string names would corrupt the Component.components_ map and silently break child resolution. The check fails fast before any registration side effects.","triggerScenarios":"Calling videojs.registerComponent('', Klass), registerComponent(null, Klass), registerComponent(undefined, Klass), or passing a number/symbol as the name.","commonSituations":"Programmatic registration where the name comes from a variable that was not initialized; bundlers that drop a name; minification bugs that mangle a string literal name.","solutions":["Pass a non-empty string literal as the name, e.g. registerComponent('MyComp', MyComp).","Validate the name variable before registering: if (typeof name === 'string' && name.length) {...}.","Check that the build pipeline preserves string-literal names (avoid registering inside mangled closures)."],"exampleFix":"// before\nvideojs.registerComponent(name, MyComp); // name is undefined\n// after\nif (typeof name === 'string' && name.length) {\n  videojs.registerComponent(name, MyComp);\n}","handlingStrategy":"validation","validationCode":"function safeRegisterComponent(name, Klass) {\n  if (typeof name !== 'string' || name.length === 0) {\n    throw new TypeError('name must be a non-empty string');\n  }\n  return videojs.registerComponent(name, Klass);\n}","typeGuard":"const isValidComponentName = (n) => typeof n === 'string' && n.length > 0;","tryCatchPattern":null,"preventionTips":["Always pass string-literal component names.","Validate names sourced from config before registering.","Keep registration code in stable, non-mangled modules."],"tags":["component","registry","validation"],"backgroundTag":null,"analyzedSha":"c3a7e0e6d20cf5400c9afbee29965fe4dff393c2","analyzedAt":"2026-08-13T04:20:15.471Z","schemaVersion":2},"datasetVersion":"2026-08-13T09:17:06.757Z"}