[LiquidDoc] Prevent rendering of hover tooltip for snippets with no renderable content (#729)

## What are you adding in this PR?

`{% render 'snippet' %}`

Prevents rendering hover tooltip for snippets that:
- do not exist
- do not have renderable content.

**Renderable content**: Currently, this means that it requires a `LiquidDoc` definition with `@param` annotations, though this will soon expand to the description and `@example` as well


## Before you deploy

<!-- Delete the checklists you don't need -->

<!-- Check changes -->
- [ ] This PR includes a new checks or changes the configuration of a check
  - [ ] I included a minor bump `changeset`
  - [ ] It's in the `allChecks` array in `src/checks/index.ts`
  - [ ] I ran `yarn build` and committed the updated configuration files
    <!-- It might be that a check doesn't make sense in a theme-app-extension context -->
    <!-- When that happens, the check's config should be updated/overridden in the theme-app-extension config -->
    <!-- see packages/node/configs/theme-app-extension.yml -->
    - [ ] If applicable, I've updated the `theme-app-extension.yml` config

<!-- Public API changes, new features -->
- [ ] I included a minor bump `changeset`
- [x] My feature is backward compatible

<!-- Bug fixes -->
- [x] I included a patch bump `changeset`

Author: jamesmengo

.changeset/mighty-flies-join.md

@@ -0,0 +1,5 @@
+---
+'@shopify/theme-language-server-common': patch
+---
+
+Prevent rendering hover tooltip for snippets that do not renderable content

packages/theme-language-server-common/src/documents/DocumentManager.ts

@@ -175,7 +175,7 @@ export class DocumentManager {
           }),
           /** Lazy and only computed once per file version */
           getLiquidDoc: memo(async (snippetName: string) => {
-            if (isError(sourceCode.ast)) return { name: snippetName };
+            if (isError(sourceCode.ast)) return undefined;
 
             return getSnippetDefinition(sourceCode.ast, snippetName);
           }),

packages/theme-language-server-common/src/documents/types.ts

@@ -24,7 +24,7 @@ export type AugmentedJsonSourceCode = _AugmentedSourceCode<SourceCodeType.JSON>;
  */
 export type AugmentedLiquidSourceCode = _AugmentedSourceCode<SourceCodeType.LiquidHtml> & {
   getSchema: () => Promise<SectionSchema | ThemeBlockSchema | AppBlockSchema | undefined>;
-  getLiquidDoc: (snippetName: string) => Promise<SnippetDefinition>;
+  getLiquidDoc: (snippetName: string) => Promise<SnippetDefinition | undefined>;
 };
 
 /**

packages/theme-language-server-common/src/hover/providers/RenderSnippetHoverProvider.spec.ts

@@ -54,10 +54,16 @@ describe('Module: RenderSnippetHoverProvider', async () => {
       );
     });
 
-    it('should return an H3 with snippet name if no LiquidDocDefinition found', async () => {
-      getSnippetDefinition = async () => ({ name: 'unknown-snippet' });
+    it('should return null if no LiquidDocDefinition found', async () => {
+      getSnippetDefinition = async () => ({ name: 'unknown-snippet', liquidDoc: undefined });
       provider = createProvider(getSnippetDefinition);
-      await expect(provider).to.hover(`{% render 'unknown-sni█ppet' %}`, '### unknown-snippet');
+      await expect(provider).to.hover(`{% render 'unknown-sni█ppet' %}`, `### unknown-snippet`);
+    });
+
+    it('should return null if snippet is null', async () => {
+      getSnippetDefinition = async () => undefined;
+      provider = createProvider(getSnippetDefinition);
+      await expect(provider).to.hover(`{% render 'unknown-sni█ppet' %}`, null);
     });
 
     it('should return nothing if not in render tag', async () => {

packages/theme-language-server-common/src/hover/providers/RenderSnippetHoverProvider.ts

@@ -9,7 +9,7 @@ export class RenderSnippetHoverProvider implements BaseHoverProvider {
     private getSnippetDefinitionForURI: (
       uri: string,
       snippetName: string,
-    ) => Promise<SnippetDefinition>,
+    ) => Promise<SnippetDefinition | undefined>,
   ) {}
 
   async hover(
@@ -32,6 +32,10 @@ export class RenderSnippetHoverProvider implements BaseHoverProvider {
       snippetName,
     );
 
+    if (!snippetDefinition) {
+      return null;
+    }
+
     const liquidDoc = snippetDefinition.liquidDoc;
 
     if (!liquidDoc) {

packages/theme-language-server-common/src/liquidDoc.spec.ts

@@ -9,7 +9,7 @@ describe('Unit: makeGetLiquidDocDefinitions', () => {
     return toSourceCode('/tmp/foo.liquid', code).ast as LiquidHtmlNode;
   }
 
-  it('should return name if no valid annotations are present in definition', async () => {
+  it('should return default snippet definition if no renderable content is present', async () => {
     const ast = toAST(`
         {% doc %}
           just a description

packages/theme-language-server-common/src/liquidDoc.ts

@@ -7,13 +7,7 @@ import { LiquidDocParamNode } from '@shopify/liquid-html-parser';
 export type GetSnippetDefinitionForURI = (
   uri: string,
   snippetName: string,
-) => Promise<SnippetDefinition>;
-
-export type LiquidDocParameter = {
-  name: string;
-  description: string | null;
-  type: string | null;
-};
+) => Promise<SnippetDefinition | undefined>;
 
 export type SnippetDefinition = {
   name: string;
@@ -24,27 +18,33 @@ type LiquidDocDefinition = {
   parameters?: LiquidDocParameter[];
 };
 
+export type LiquidDocParameter = {
+  name: string;
+  description: string | null;
+  type: string | null;
+};
+
 export function getSnippetDefinition(
   snippet: LiquidHtmlNode,
   snippetName: string,
 ): SnippetDefinition {
-  const liquidDocParameters: LiquidDocParameter[] = visit<
-    SourceCodeType.LiquidHtml,
-    LiquidDocParameter
-  >(snippet, {
-    LiquidDocParamNode(node: LiquidDocParamNode) {
-      return {
-        name: node.paramName.value,
-        description: node.paramDescription?.value ?? null,
-        type: node.paramType?.value ?? null,
-      };
+  const parameters: LiquidDocParameter[] = visit<SourceCodeType.LiquidHtml, LiquidDocParameter>(
+    snippet,
+    {
+      LiquidDocParamNode(node: LiquidDocParamNode) {
+        return {
+          name: node.paramName.value,
+          description: node.paramDescription?.value ?? null,
+          type: node.paramType?.value ?? null,
+        };
+      },
     },
-  });
+  );
 
   return {
     name: snippetName,
     liquidDoc: {
-      parameters: liquidDocParameters,
+      parameters,
     },
   };
 }

packages/theme-language-server-common/src/server/startServer.ts

@@ -43,8 +43,7 @@ import { snippetName } from '../utils/uri';
 import { VERSION } from '../version';
 import { CachedFileSystem } from './CachedFileSystem';
 import { Configuration } from './Configuration';
-import { LiquidHtmlNode } from '@shopify/liquid-html-parser';
-import { getSnippetDefinition, SnippetDefinition } from '../liquidDoc';
+import { SnippetDefinition } from '../liquidDoc';
 
 const defaultLogger = () => {};
 
@@ -176,13 +175,13 @@ export function startServer(
   const getSnippetDefinitionForURI = async (
     uri: string,
     snippetName: string,
-  ): Promise<SnippetDefinition> => {
+  ): Promise<SnippetDefinition | undefined> => {
     const rootUri = await findThemeRootURI(uri);
     const snippetURI = path.join(rootUri, 'snippets', `${snippetName}.liquid`);
     const snippet = documentManager.get(snippetURI);
 
     if (!snippet || snippet.type !== SourceCodeType.LiquidHtml || isError(snippet.ast)) {
-      return { name: snippetName };
+      return undefined;
     }
 
     return snippet.getLiquidDoc(snippetName);