@lvce-editor/static-server 0.64.2 → 0.64.4

package/static/{4c6d25a → f04e70d}/packages/extension-detail-view-worker/dist/extensionDetailViewWorkerMain.js

@@ -27,9 +27,14 @@ const Enable$1 = 'Enable';
 const Features$2 = 'Features';
 const FileMatch = 'File Match';
 const Id = 'ID';
+const Name = 'Name';
+const FileExtensions = 'File Extensions';
+const Grammar = 'Grammar';
+const Snippets = 'Snippets';
 const Identifier = 'Identifier';
 const ImportTime = 'Import Time: ';
 const Installation = 'Installation';
+const InvalidLink = 'Invalid link';
 const Issues = 'Issues';
 const JsonValidation$1 = 'Json Validation';
 const Label = 'Label';
@@ -42,18 +47,21 @@ const NoReadmeFound = 'No Readme Found.';
 const OpenImageInNewTab = 'Open Image in New Tab';
 const OpenInNewTab = 'Open in New Tab';
 const ProgrammingLanguages$1 = 'Programming Languages';
+const PropertyMustBeOfTypeString = 'Property must be a string';
 const Published = 'Published';
 const Repository = 'Repository';
 const Resources$1 = 'Resources';
 const RuntimeStatus$1 = 'Runtime Status';
 const SaveImageAs = 'Save Image as';
 const Schema = 'Schema';
+const SchemaNotFound = 'Schema not found';
 const ScrollToTop$1 = 'Scroll to top';
 const SelectedFeatureUnknownOrUnsupported = 'Selected feature is unknown or unsupported';
 const Selector = 'Selector';
 const SetColorTheme$1 = 'Set Color Theme';
 const Settings$1 = 'Settings';
 const Size = 'Size';
+const StringMustNotBeEmpty = 'String must not be empty';
 const Theme$1 = 'Theme';
 const Uninstall$1 = 'Uninstall';
 const UnsupportedFeature = 'Unsupported Feature';
@@ -147,6 +155,18 @@ const settings = () => {
 const id$1 = () => {
   return i18nString(Id);
 };
+const name = () => {
+  return i18nString(Name);
+};
+const fileExtensions = () => {
+  return i18nString(FileExtensions);
+};
+const grammar = () => {
+  return i18nString(Grammar);
+};
+const snippets = () => {
+  return i18nString(Snippets);
+};
 const selector = () => {
   return i18nString(Selector);
 };
@@ -207,16 +227,62 @@ const repository = () => {
 const license = () => {
   return i18nString(License);
 };
+const propertyMustBeOfTypeString = () => {
+  return i18nString(PropertyMustBeOfTypeString);
+};
+const stringMustNotBeEmpty = () => {
+  return i18nString(StringMustNotBeEmpty);
+};
+const schemaNotFound = () => {
+  return i18nString(SchemaNotFound);
+};
+const invalidLink = () => {
+  return i18nString(InvalidLink);
+};
+
+const getActivationEntry = value => {
+  if (typeof value !== 'string') {
+    return {
+      isValid: false,
+      stringValue: JSON.stringify(value),
+      errorMessage: propertyMustBeOfTypeString()
+    };
+  }
+  if (!value) {
+    return {
+      isValid: false,
+      stringValue: '',
+      errorMessage: stringMustNotBeEmpty()
+    };
+  }
+  return {
+    isValid: true,
+    stringValue: value,
+    errorMessage: ''
+  };
+};
+const getActivationEntries = activation => {
+  return activation.map(getActivationEntry);
+};
 
 const getActivationEventsDetails = async extension => {
   const activationEvents = extension.activation || [];
+  const activationEntries = getActivationEntries(activationEvents);
   return {
-    activationEvents
+    activationEvents,
+    activationEntries
   };
 };
 
+const hasProperty = (object, key) => {
+  if (!object || typeof object !== 'object' || !(key in object)) {
+    return false;
+  }
+  return true;
+};
+
 const featureActivationEventsEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('activation' in extension)) {
+  if (!hasProperty(extension, 'activation')) {
     return false;
   }
   return Array.isArray(extension.activation);
@@ -253,7 +319,9 @@ const Dt = 67;
 
 const ClientX = 'event.clientX';
 const ClientY = 'event.clientY';
+const TargetHref = 'event.target.href';
 const TargetName = 'event.target.name';
+const TargetSrc = 'event.target.src';
 
 const DebugWorker = 55;
 const ExtensionHostWorker = 44;
@@ -305,7 +373,7 @@ const Features$1 = 'Features';
 const FeaturesList = 'FeaturesList';
 const FeatureWebView = 'FeatureWebView';
 const Large$1 = 'Large';
-const Link = 'Link';
+const Link$1 = 'Link';
 const Markdown = 'Markdown';
 const MoreInfo = 'MoreInfo';
 const MoreInfoEntry = 'MoreInfoEntry';
@@ -323,6 +391,7 @@ const SettingsIcon = 'SettingsIcon';
 const Small$1 = 'Small';
 const Table = 'Table';
 const TableCell = 'TableCell';
+const TableCellInvalid = 'TableCellInvalid';
 const TableHeading = 'TableHeading';
 const Viewlet = 'Viewlet';
 
@@ -335,7 +404,20 @@ const code = {
   childCount: 1
 };
 const getActivationEventVirtualDom = event => {
-  return [li, code, text(event)];
+  const {
+    stringValue,
+    errorMessage,
+    isValid
+  } = event;
+  if (!isValid) {
+    return [{
+      type: Li,
+      childCount: 1,
+      title: errorMessage,
+      className: 'ListItem ListItemInvalid'
+    }, code, text(stringValue)];
+  }
+  return [li, code, text(stringValue)];
 };
 
 const getFeatureContentHeadingVirtualDom = heading => {
@@ -358,11 +440,12 @@ const getFeatureActivationEventsVirtualDom = activationEvents$1 => {
 };
 
 const getActivationEventsVirtualDom = state => {
-  return getFeatureActivationEventsVirtualDom(state.activationEvents);
+  return getFeatureActivationEventsVirtualDom(state.activationEntries);
 };
 
 const Text = 1;
 const Code = 2;
+const Link = 7;
 
 const getCommandTableEntry = command => {
   // TODO watch out for command being null/undefined/number/string/array
@@ -388,7 +471,7 @@ const getCommandsDetails = async extension => {
 };
 
 const featureCommandsEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('commands' in extension)) {
+  if (!hasProperty(extension, 'commands')) {
     return false;
   }
   return Array.isArray(extension.commands);
@@ -424,31 +507,58 @@ const getTableHeadingVirtualDom = heading => {
   }, text(heading)];
 };
 
-const getCellCodeVirtualDom = value => {
+const getCellCodeVirtualDom = (value, props) => {
+  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
     type: Td,
-    className: TableCell,
-    childCount: 1
+    className: tdClassName,
+    childCount: 1,
+    ...(props?.title ? {
+      title: props.title
+    } : {})
   }, {
     type: Code$2,
     childCount: 1
   }, text(value)];
 };
 
-const getCellTextVirtualDom = value => {
+const getCellLinkVirtualDom = (value, props) => {
+  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
     type: Td,
-    className: TableCell,
+    className: tdClassName,
+    childCount: 1,
+    ...(props?.title ? {
+      title: props.title
+    } : {})
+  }, {
+    type: A,
+    className: Link$1,
+    href: props?.href,
     childCount: 1
   }, text(value)];
 };
 
+const getCellTextVirtualDom = (value, props) => {
+  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
+  return [{
+    type: Td,
+    className: tdClassName,
+    childCount: 1,
+    ...(props?.title ? {
+      title: props.title
+    } : {})
+  }, text(value)];
+};
+
 const getCellRenderer = type => {
   switch (type) {
     case Code:
       return getCellCodeVirtualDom;
     case Text:
       return getCellTextVirtualDom;
+    case Link:
+      return getCellLinkVirtualDom;
     default:
       throw new Error(`unexpected cell type ${type}`);
   }
@@ -457,10 +567,11 @@ const getCellRenderer = type => {
 const getCellVirtualDom = entry => {
   const {
     value,
-    type
+    type,
+    ...props
   } = entry;
   const fn = getCellRenderer(type);
-  return fn(value);
+  return fn(value, props);
 };
 
 const getTableRowVirtualDom = entries => {
@@ -509,31 +620,194 @@ const getCommandsVirtualDom = state => {
   return getFeatureCommandsVirtualDom(state.commands);
 };
 
-const getJsonValidationTableEntry = validation => {
-  // TODO handle case when validation is invalid like null
+const isExternalLink$1 = schema => {
+  return schema.startsWith('http://') || schema.startsWith('https://');
+};
+const hasWhitespace = value => {
+  return /\s/.test(value);
+};
+const isOnlyDotsOrEmpty = value => {
+  const trimmed = value.trim();
+  return trimmed === '' || /^\.*$/.test(trimmed);
+};
+const isValidHttpUrl = value => {
+  try {
+    const url = new URL(value);
+    return (url.protocol === 'http:' || url.protocol === 'https:') && !!url.hostname;
+  } catch {
+    return false;
+  }
+};
+const isValidRelativePath = value => {
+  // Disallow schemes and whitespace
+  if (hasWhitespace(value)) {
+    return false;
+  }
+  if (value.includes('://')) {
+    return false;
+  }
+  if (isOnlyDotsOrEmpty(value)) {
+    return false;
+  }
+  // Allow paths like ./a.json, ../a.json, /a.json, schemas/a.json, a/b.json
+  if (!/^[./]?[A-Za-z0-9._\-/]+$/.test(value)) {
+    return false;
+  }
+  // Must contain at least one alphanumeric character
+  if (!/[A-Za-z0-9]/.test(value)) {
+    return false;
+  }
+  return true;
+};
+const getSchemaLinkUrl = (schema, extensionUri) => {
+  if (!schema || typeof schema !== 'string') {
+    return '';
+  }
+  const trimmed = schema.trim();
+  if (trimmed !== schema) {
+    return '';
+  }
+  if (isExternalLink$1(schema)) {
+    return isValidHttpUrl(schema) ? schema : '';
+  }
+  if (!isValidRelativePath(schema)) {
+    return '';
+  }
+  try {
+    return new URL(schema, extensionUri).toString();
+  } catch {
+    return '';
+  }
+};
+
+const existsJson = async schemaUrl => {
+  try {
+    // TODO verify that response header is json
+    const response = await fetch(schemaUrl, {
+      method: 'HEAD'
+    });
+    return response.ok;
+  } catch {
+    return false;
+  }
+};
+const getJsonValidationInfos = async (extensionUri, validations) => {
+  const validationInfos = [];
+  for (const validation of validations) {
+    const schema = validation.schema ?? validation.url;
+    const schemaLinkUrl = getSchemaLinkUrl(schema, extensionUri);
+    const {
+      fileMatch
+    } = validation;
+    if (typeof schema !== 'string') {
+      validationInfos.push({
+        isValid: false,
+        stringValue: JSON.stringify(schema),
+        schemaUrl: '',
+        errorMessage: propertyMustBeOfTypeString(),
+        fileMatch
+      });
+    } else if (schema && !schemaLinkUrl) {
+      validationInfos.push({
+        isValid: false,
+        stringValue: schema,
+        schemaUrl: schemaLinkUrl,
+        errorMessage: invalidLink(),
+        fileMatch
+      });
+    } else if (schemaLinkUrl) {
+      if (await existsJson(schemaLinkUrl)) {
+        validationInfos.push({
+          isValid: true,
+          stringValue: schema,
+          schemaUrl: schemaLinkUrl,
+          errorMessage: '',
+          fileMatch
+        });
+      } else {
+        validationInfos.push({
+          isValid: false,
+          stringValue: schema,
+          schemaUrl: schemaLinkUrl,
+          errorMessage: schemaNotFound(),
+          fileMatch
+        });
+      }
+    } else {
+      validationInfos.push({
+        isValid: true,
+        stringValue: schema,
+        schemaUrl: schemaLinkUrl,
+        errorMessage: '',
+        fileMatch
+      });
+    }
+  }
+  return validationInfos;
+};
+
+const getJsonValidationTableEntry = validationInfo => {
   const {
+    isValid,
+    errorMessage,
+    schemaUrl,
+    stringValue,
     fileMatch
-  } = validation;
-  const schema = validation.schema ?? validation.url;
+  } = validationInfo;
+  if (!isValid && schemaUrl) {
+    return [{
+      type: Code,
+      value: fileMatch
+    }, {
+      type: Link,
+      value: stringValue,
+      href: schemaUrl,
+      className: TableCellInvalid,
+      title: errorMessage
+    }];
+  }
+  if (!isValid) {
+    return [{
+      type: Text,
+      value: fileMatch
+    }, {
+      type: Text,
+      value: stringValue,
+      className: TableCellInvalid,
+      title: errorMessage
+    }];
+  }
+  if (schemaUrl) {
+    return [{
+      type: Code,
+      value: fileMatch
+    }, {
+      type: Link,
+      value: stringValue,
+      href: schemaUrl
+    }];
+  }
   return [{
     type: Code,
     value: fileMatch
   }, {
-    type: Code,
-    value: schema
+    type: Text,
+    value: stringValue
   }];
 };
 
 const getJsonValidationDetails = async extension => {
   const validations = extension.jsonValidation || [];
-  const rows = validations.map(getJsonValidationTableEntry);
+  const extensionUri = extension.uri || '';
+  const validationInfos = await getJsonValidationInfos(extensionUri, validations);
+  const rows = validationInfos.map(getJsonValidationTableEntry);
   return {
     jsonValidation: rows
   };
 };
 
 const featureJsonValidationEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('jsonValidation' in extension)) {
+  if (!hasProperty(extension, 'jsonValidation')) {
     return false;
   }
   return Array.isArray(extension.jsonValidation);
@@ -561,33 +835,56 @@ const getJsonValidationVirtualDom = state => {
   return getFeatureJsonValidationVirtualDom(state.jsonValidation);
 };
 
-const getProgrammingLanguagesDetails = async extension => {
-  // Programming languages feature doesn't need to store additional state
-  return {};
+const getProgrammingLanguageTableEntry = programmingLanguage => {
+  return [];
+};
+
+const getFeatureDetailsProgrammingLanguages = async extension => {
+  // TODO validate them also, to create better types
+  const programmingLanguages = extension.languages || [];
+  const rows = programmingLanguages.map(getProgrammingLanguageTableEntry);
+  return {
+    programmingLanguages: rows
+  };
 };
 
 const featureProgrammingLanguagesEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('programmingLanguages' in extension)) {
+  if (!hasProperty(extension, 'languages')) {
     return false;
   }
   const {
-    programmingLanguages
+    languages
   } = extension;
-  return Array.isArray(programmingLanguages);
+  return Array.isArray(languages);
+};
+
+const getProgrammingLanguagesTableEntries = rows => {
+  const id = id$1();
+  const name$1 = name();
+  const fileExtensions$1 = fileExtensions();
+  const grammar$1 = grammar();
+  const snippets$1 = snippets();
+  return {
+    headings: [id, name$1, fileExtensions$1, grammar$1, snippets$1],
+    rows
+  };
 };
 
-const getFeatureProgrammingLanguagesVirtualDom = () => {
+const getFeatureProgrammingLanguagesVirtualDom = programmingLanguages$1 => {
   const heading = programmingLanguages();
-  // TODO
+  const tableInfo = getProgrammingLanguagesTableEntries(programmingLanguages$1);
   return [{
     type: Div,
     className: FeatureContent,
-    childCount: 1
-  }, ...getFeatureContentHeadingVirtualDom(heading)];
+    childCount: 2
+  }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
 const getProgrammingLanguagesVirtualDom = state => {
-  return getFeatureProgrammingLanguagesVirtualDom();
+  const {
+    programmingLanguages
+  } = state;
+  return getFeatureProgrammingLanguagesVirtualDom(programmingLanguages);
 };
 
 class FeatureNotFoundError extends Error {
@@ -2353,7 +2650,7 @@ const getSettingsDetails = async extension => {
 };
 
 const featureSettingsEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('settings' in extension)) {
+  if (!hasProperty(extension, 'settings')) {
     return false;
   }
   return Array.isArray(extension.settings);
@@ -2396,6 +2693,8 @@ const HandleImageContextMenu = 11;
 const HandleReadmeContextMenu = 12;
 const HandleReadmeScroll = 13;
 const HandleTabsClick = 14;
+const HandleAdditionalDetailContextMenu = 15;
+const HandleReadmeClick = 16;
 
 const ActivationEvents = 'ActivationEvents';
 const Changelog = 'Changelog';
@@ -2445,7 +2744,8 @@ const getMarkdownVirtualDom = async (html, options) => {
     return [{
       ...firstNode,
       onScroll: HandleReadmeScroll,
-      childCount: firstNode.childCount + 1
+      childCount: firstNode.childCount + 1,
+      onClick: HandleReadmeClick
     }, ...extraDom, ...rest];
   }
   return dom;
@@ -2484,22 +2784,32 @@ const getThemeMarkdown = (themes, iconThemes, productIconThemes) => {
   return markdown;
 };
 
+const padBytes = bytes => {
+  return bytes.toString(16).padStart(2, '0');
+};
+const hash = async content => {
+  const sourceBytes = new TextEncoder().encode(content);
+  const digest = await crypto.subtle.digest('SHA-256', sourceBytes);
+  const resultBytes = [...new Uint8Array(digest)];
+  return resultBytes.map(padBytes).join('');
+};
+
 const supportsNormalCacheKey = locationProtocol => {
   return locationProtocol === 'http:' || locationProtocol === 'https:';
 };
-const getMarkdownCacheKey = (hash, locationProtocol) => {
-  if (supportsNormalCacheKey(locationProtocol)) {
+
+const getMarkdownCacheHash = async (markdown, options) => {
+  const stringifiedOptions = JSON.stringify(options);
+  const contents = `${markdown}:${stringifiedOptions}`;
+  return hash(contents);
+};
+const getMarkdownCacheKey = async (markdown, options) => {
+  const hash = await getMarkdownCacheHash(markdown, options);
+  if (supportsNormalCacheKey(options.locationProtocol)) {
     return `/markdown/${hash}`;
   }
   // workaround for electron bug
-  return `https://markdown/${hash}`;
-};
-
-const hash = async content => {
-  const sourceBytes = new TextEncoder().encode(content);
-  const digest = await crypto.subtle.digest('SHA-256', sourceBytes);
-  const resultBytes = [...new Uint8Array(digest)];
-  return resultBytes.map(x => x.toString(16).padStart(2, '0')).join('');
+  return `https://-/markdown/${hash}`;
 };
 
 // TODO pass application name from renderer worker to not hardcode it
@@ -2560,8 +2870,7 @@ const set$3 = async (key, value) => {
 };
 
 const renderMarkdownCached = async (markdown, options) => {
-  const markdownHash = await hash(markdown); // TODO hash options also
-  const cacheKey = getMarkdownCacheKey(markdownHash, options.locationProtocol);
+  const cacheKey = await getMarkdownCacheKey(markdown, options);
   const hasItem = await has(cacheKey);
   if (hasItem) {
     const value = await get$1(cacheKey);
@@ -2595,21 +2904,21 @@ const getThemeDetails = async (extension, baseUrl, locationProtocol) => {
 };
 
 const featureColorThemeEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('colorThemes' in extension)) {
+  if (!hasProperty(extension, 'colorThemes')) {
     return false;
   }
   return Array.isArray(extension.colorThemes);
 };
 
 const featureIconThemeEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('iconThemes' in extension)) {
+  if (!hasProperty(extension, 'iconThemes')) {
     return false;
   }
   return Array.isArray(extension.iconThemes);
 };
 
 const featureProductIconThemeEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('productIconThemes' in extension)) {
+  if (!hasProperty(extension, 'productIconThemes')) {
     return false;
   }
   return Array.isArray(extension.productIconThemes);
@@ -2678,7 +2987,7 @@ const getWebViewsDetails = async extension => {
 };
 
 const featureWebViewsEnabled = extension => {
-  if (!extension || typeof extension !== 'object' || !('webViews' in extension)) {
+  if (!hasProperty(extension, 'webViews')) {
     return false;
   }
   return Array.isArray(extension.webViews);
@@ -2766,7 +3075,7 @@ const registerAllFeatures = () => {
     id: ProgrammingLanguages,
     getLabel: programmingLanguages,
     isEnabled: featureProgrammingLanguagesEnabled,
-    getDetails: getProgrammingLanguagesDetails,
+    getDetails: getFeatureDetailsProgrammingLanguages,
     getVirtualDom: getProgrammingLanguagesVirtualDom
   });
   register$1({
@@ -3013,7 +3322,8 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     paddingRight: 0,
     showSideBar: true,
     sideBarWidth: 0,
-    locationProtocol: ''
+    locationProtocol: '',
+    activationEntries: []
   };
   set(uid, state, state);
 };
@@ -3134,6 +3444,10 @@ const getMenus = () => {
   }];
 };
 
+const handleAdditionalDetailContextMenu = state => {
+  return state;
+};
+
 const openExtensionSearch = async searchValue => {
   await openExtensionSearch$1();
   await setExtensionsSearchValue(searchValue);
@@ -3380,6 +3694,20 @@ const handleImageContextMenu = async (state, eventX, eventY) => {
   return state;
 };
 
+const isExternalLink = href => {
+  return href.startsWith('http://') || href.startsWith('https://');
+};
+const handleReadmeClick = async (state, nodeName, href) => {
+  if (!href || !isExternalLink(href)) {
+    return state;
+  }
+  // TODO what to do about relative links? open them in editor?
+  // TODO what to do about mail links?
+  await openUrl$2(href);
+  // TODO check node name and href
+  return state;
+};
+
 const handleScroll = (state, scrollTop, scrollSource = Script) => {
   const newScrollTop = Math.max(0, scrollTop);
   return {
@@ -4302,7 +4630,7 @@ const getMoreInfoEntryKeyVirtualDom = item => {
   return [parentNode, text(key)];
 };
 
-const classLink = mergeClassNames(MoreInfoEntryValue, Link);
+const classLink = mergeClassNames(MoreInfoEntryValue, Link$1);
 const classCode = mergeClassNames(MoreInfoEntryValue, Code$1);
 const getMoreInfoEntryValueClassName = (onClick, code) => {
   if (onClick) {
@@ -4324,13 +4652,15 @@ const getMoreInfoEntryValueTag = (onClick, code) => {
   return Dd;
 };
 
-const getExtraProps = title => {
+const getExtraProps = (title, onClick) => {
+  const props = Object.create(null);
   if (title) {
-    return {
-      title
-    };
+    props.title = title;
   }
-  return {};
+  if (onClick) {
+    props.tabIndex = 0;
+  }
+  return props;
 };
 const getMoreInfoEntryValueVirtualDom = item => {
   const {
@@ -4341,7 +4671,7 @@ const getMoreInfoEntryValueVirtualDom = item => {
   } = item;
   const type = getMoreInfoEntryValueTag(onClick, code);
   const className = getMoreInfoEntryValueClassName(onClick, code);
-  const extraProps = getExtraProps(title);
+  const extraProps = getExtraProps(title, onClick);
   return [{
     type,
     className,
@@ -4410,10 +4740,19 @@ const getAdditionalDetailsVirtualDom = (showAdditionalDetails, firstHeading, ent
     type: Div,
     className: AdditionalDetails,
     tabIndex: 0,
-    childCount: 4
+    childCount: 4,
+    onClick: HandleAdditionalDetailContextMenu
   }, ...getAdditionalDetailsEntryVirtualDom(firstHeading, entries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(secondHeading, secondEntries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(thirdHeading, categories, getCategoriesDom), ...getAdditionalDetailsEntryVirtualDom(fourthHeading, resources, getResourcesVirtualDom)];
 };
 
+const getNoReadmeVirtualDom = () => {
+  return [{
+    type: Div,
+    childCount: 1,
+    className: Markdown
+  }, text(noReadmeFound())];
+};
+
 const getChildCount = (additionalDetails, scrollToTopEnabled) => {
   let count = 1;
   if (additionalDetails) {
@@ -4428,11 +4767,7 @@ const getDetailsVirtualDom = (sanitizedReadmeHtml, width, scrollToTopButtonEnabl
   const fourthHeading = resources();
   const showAdditionalDetails = showSideBar;
   const childCount = getChildCount(showAdditionalDetails);
-  const contentDom = hasReadme ? sanitizedReadmeHtml : [{
-    type: Div,
-    childCount: 1,
-    className: Markdown
-  }, text(noReadmeFound())];
+  const contentDom = hasReadme ? sanitizedReadmeHtml : getNoReadmeVirtualDom();
   const dom = [{
     type: Div,
     className: ExtensionDetailPanel,
@@ -4756,6 +5091,10 @@ const render2 = (uid, diffResult) => {
 // @ts-nocheck
 const renderEventListeners = () => {
   return [{
+    name: HandleAdditionalDetailContextMenu,
+    params: ['handleAdditionalDetailsContextMenu'],
+    preventDefault: true
+  }, {
     name: HandleClickCategory,
     params: ['handleClickCategory', TargetName]
   }, {
@@ -4763,7 +5102,7 @@ const renderEventListeners = () => {
     params: ['handleIconError']
   }, {
     name: HandleReadmeContextMenu,
-    params: ['handleReadmeContextMenu', ClientX, ClientY, 'event.target.href', 'event.target.src']
+    params: ['handleReadmeContextMenu', ClientX, ClientY, TargetHref, TargetSrc]
   }, {
     name: HandleImageContextMenu,
     params: ['handleImageContextMenu', ClientX, ClientY],
@@ -4791,6 +5130,10 @@ const renderEventListeners = () => {
   }, {
     name: HandleClickSettings,
     params: ['handleClickSettings']
+  }, {
+    name: HandleReadmeClick,
+    params: ['handleReadmeClick', 'event.target.nodeName', 'event.target.href'],
+    preventDefault: true
   }, {
     name: HandleClickUninstall,
     params: ['handleClickUninstall']
@@ -4839,6 +5182,7 @@ const commandMap = {
   'ExtensionDetail.getMenuEntries': getMenuEntries,
   'ExtensionDetail.getMenus': getMenus,
   'ExtensionDetail.handleClickCategory': wrapCommand(handleClickCategory),
+  'ExtensionDetail.handleAdditionalDetailsContextMenu': wrapCommand(handleAdditionalDetailContextMenu),
   'ExtensionDetail.handleClickDisable': wrapCommand(handleClickDisable),
   'ExtensionDetail.handleClickEnable': wrapCommand(handleClickEnable),
   'ExtensionDetail.handleClickScrollToTop': wrapCommand(handleClickScrollToTop),
@@ -4852,6 +5196,7 @@ const commandMap = {
   'ExtensionDetail.handleImageContextMenu': wrapCommand(handleImageContextMenu),
   'ExtensionDetail.handleScroll': wrapCommand(handleScroll),
   'ExtensionDetail.handleTabsClick': wrapCommand(handleTabsClick),
+  'ExtensionDetail.handleReadmeClick': wrapCommand(handleReadmeClick),
   'ExtensionDetail.handleWheel': wrapCommand(handleScroll),
   // deprecated
   'ExtensionDetail.initialize': initialize,