From 5bf7cca35dbb646d49dabda9f196478501782743 Mon Sep 17 00:00:00 2001 From: Grace Park Date: Wed, 18 Aug 2021 08:52:44 -0700 Subject: [PATCH] remove liquid tags (#20937) --- components/landing/ArticleList.tsx | 5 +- .../liquid-tags/link-as-article-card.html | 14 --- includes/liquid-tags/link-in-list.html | 1 - includes/liquid-tags/link-with-intro.html | 4 - includes/liquid-tags/link.html | 1 - includes/liquid-tags/topic-link-in-list.html | 1 - lib/liquid-tags/README.md | 39 +----- lib/liquid-tags/homepage-link-with-intro.js | 3 - lib/liquid-tags/link-as-article-card.js | 16 --- lib/liquid-tags/link-in-list.js | 2 - lib/liquid-tags/link-with-intro.js | 3 - lib/liquid-tags/link.js | 113 ------------------ lib/liquid-tags/topic-link-in-list.js | 2 - lib/render-content/index.js | 11 -- tests/rendering/curated-homepage-links.js | 4 +- tests/unit/liquid-helpers.js | 71 ----------- 16 files changed, 4 insertions(+), 286 deletions(-) delete mode 100644 includes/liquid-tags/link-as-article-card.html delete mode 100644 includes/liquid-tags/link-in-list.html delete mode 100644 includes/liquid-tags/link-with-intro.html delete mode 100644 includes/liquid-tags/link.html delete mode 100644 includes/liquid-tags/topic-link-in-list.html delete mode 100644 lib/liquid-tags/homepage-link-with-intro.js delete mode 100644 lib/liquid-tags/link-as-article-card.js delete mode 100644 lib/liquid-tags/link-in-list.js delete mode 100644 lib/liquid-tags/link-with-intro.js delete mode 100644 lib/liquid-tags/link.js delete mode 100644 lib/liquid-tags/topic-link-in-list.js diff --git a/components/landing/ArticleList.tsx b/components/landing/ArticleList.tsx index a818d46b80a2..af0b78460835 100644 --- a/components/landing/ArticleList.tsx +++ b/components/landing/ArticleList.tsx @@ -45,10 +45,7 @@ export const ArticleList = ({ {articles.map((link) => { return (
  • - +

    → diff --git a/includes/liquid-tags/link-as-article-card.html b/includes/liquid-tags/link-as-article-card.html deleted file mode 100644 index 628a2618edd6..000000000000 --- a/includes/liquid-tags/link-as-article-card.html +++ /dev/null @@ -1,14 +0,0 @@ -
    - -

    {{ title }}

    -
    {{ type.value }}
    -

    {{ intro }}

    - {% if topics.length %} -
    - {% for topic in topics %} - {{ topic }} - {% endfor %} -
    - {% endif %} -     -
    \ No newline at end of file diff --git a/includes/liquid-tags/link-in-list.html b/includes/liquid-tags/link-in-list.html deleted file mode 100644 index 51a25c9fe8be..000000000000 --- a/includes/liquid-tags/link-in-list.html +++ /dev/null @@ -1 +0,0 @@ -- {{ title }} \ No newline at end of file diff --git a/includes/liquid-tags/link-with-intro.html b/includes/liquid-tags/link-with-intro.html deleted file mode 100644 index 361f22042fbf..000000000000 --- a/includes/liquid-tags/link-with-intro.html +++ /dev/null @@ -1,4 +0,0 @@ - -

    {{ title }}→

    -     -{% if intro %}

    {{ intro }}

    {% endif %} \ No newline at end of file diff --git a/includes/liquid-tags/link.html b/includes/liquid-tags/link.html deleted file mode 100644 index c41d80ea0ea3..000000000000 --- a/includes/liquid-tags/link.html +++ /dev/null @@ -1 +0,0 @@ -{{ title }} \ No newline at end of file diff --git a/includes/liquid-tags/topic-link-in-list.html b/includes/liquid-tags/topic-link-in-list.html deleted file mode 100644 index 87d5ddfdc2d7..000000000000 --- a/includes/liquid-tags/topic-link-in-list.html +++ /dev/null @@ -1 +0,0 @@ -- {{ title }} \ No newline at end of file diff --git a/lib/liquid-tags/README.md b/lib/liquid-tags/README.md index 927be5a15134..45db45415a38 100644 --- a/lib/liquid-tags/README.md +++ b/lib/liquid-tags/README.md @@ -5,7 +5,6 @@ See also [contributing/liquid-helpers.md](../../contributing/liquid-helpers.md) This directory contains custom Liquid tags for outputting dynamic content. These custom tags exist for a few reasons: - Content and styling should be separated. Writers should not be concerned with writing or maintaining stylistic markup. -- Writers should be able to create links by specifying the minimum amount of identifying information (an article href) and leave it to the site to dynamically inject that page's metadata like `title`, `intro`, etc. - Content should be localized to match the current language. - Styling and markup should be DRY and reusable. @@ -19,49 +18,13 @@ Tags can be used in: Tags always expect a single argument, a language agnostic href: ```html -{% link_with_intro /getting-started-with-github-desktop %} +{% data variables.product.product_name %} ``` -where the reference must be in the parent file, `content/desktop/index.md`, as it points to `content/desktop/getting-started-with-github-desktop`. - -The href can also be an absolute path: - -```html -{% link_with_intro /desktop/getting-started-with-github-desktop %} -``` - -where the reference can be in any file. - -**Note:** Every href, whether relative or absolute, must start with a slash (`/`). Do not include `content` in the href. - -The tag above will output this HTML for English pages: - -```html - -

    Getting started with GitHub Desktop→

    -     -

    Get GitHub Desktop set up to manage your project work. Authenticate to GitHub.com or GitHub Enterprise Server, keep the app up-to-date, and review your preferred settings.

    -``` - -and this HTML for Spanish pages: - -```html - -

    Comenzar con GitHub Desktop→

     -

    Configura GitHub Desktop para administrar tu proyecto de trabajo. Autentícate en GitHub.com o en el Servidor de GitHub Enterprise, mantén la app actualizada y revisa tu configuración preferida.

    -``` - -Note that link tags will only render links that are available in the current page version (i.e. GitHub.com vs Enterprise), so it's not necessary to add Liquid conditionals around them. - ## Supported tags | Markup | Renders | | -- | -- | -| `{% link /href %}` | The linked page's title, with no special styling. -| `{% link_with_intro /href %}` | The linked page's title and intro. -| `{% homepage_link_with_intro /href %}` | The linked page's title and intro, with homepage-specific styling. -| `{% link_in_list /href %}` | The linked page's title in a list item. -| `{% topic_link_in_list /href %}` | The linked map topic's title in a list item (used in category TOCs). | `{% indented_data_reference foo.bar spaces=NUMBER %}` | A data reference with the specified number of spaces prepended to each line. Defaults to 2 spaces if no spaces included. For example: `{% indented_data_reference reusables.pages.wildcard-dns-warning spaces=3 %}` ## Creating tags diff --git a/lib/liquid-tags/homepage-link-with-intro.js b/lib/liquid-tags/homepage-link-with-intro.js deleted file mode 100644 index e1d562e1b693..000000000000 --- a/lib/liquid-tags/homepage-link-with-intro.js +++ /dev/null @@ -1,3 +0,0 @@ -import link from './link.js' -// For details, see class method in lib/liquid-tags/link.js -export default link('homepage-link-with-intro') diff --git a/lib/liquid-tags/link-as-article-card.js b/lib/liquid-tags/link-as-article-card.js deleted file mode 100644 index cfb9a1ab8e39..000000000000 --- a/lib/liquid-tags/link-as-article-card.js +++ /dev/null @@ -1,16 +0,0 @@ -import link from './link.js' -const linkAsArticleCard = link('link-as-article-card') - -// For details, see class method in lib/liquid-tags/link.js -linkAsArticleCard.renderPageProps = async function renderPageProps(page, ctx, props) { - const renderedProps = await link().renderPageProps(page, ctx, props) - const { type: typeKey, topics = [] } = page - const typeVal = typeKey ? ctx.site.data.ui.product_sublanding.guide_types[typeKey] : null - return { - ...renderedProps, - type: { key: typeKey, value: typeVal }, - topics, - } -} - -export default linkAsArticleCard diff --git a/lib/liquid-tags/link-in-list.js b/lib/liquid-tags/link-in-list.js deleted file mode 100644 index 2aa5a1c27777..000000000000 --- a/lib/liquid-tags/link-in-list.js +++ /dev/null @@ -1,2 +0,0 @@ -import link from './link.js' -export default link('link-in-list') diff --git a/lib/liquid-tags/link-with-intro.js b/lib/liquid-tags/link-with-intro.js deleted file mode 100644 index eaaa97ab921e..000000000000 --- a/lib/liquid-tags/link-with-intro.js +++ /dev/null @@ -1,3 +0,0 @@ -import link from './link.js' -// For details, see class method in lib/liquid-tags/link.js -export default link('link-with-intro') diff --git a/lib/liquid-tags/link.js b/lib/liquid-tags/link.js deleted file mode 100644 index e61e1db41095..000000000000 --- a/lib/liquid-tags/link.js +++ /dev/null @@ -1,113 +0,0 @@ -import { fileURLToPath } from 'url' -import path from 'path' -import assert from 'assert' -import readFileAsync from '../readfile-async.js' -import findPage from '../find-page.js' -import { getPathWithoutLanguage, getPathWithoutVersion } from '../path-utils.js' -import getApplicableVersions from '../get-applicable-versions.js' -import removeFPTFromPath from '../remove-fpt-from-path.js' -const __dirname = path.dirname(fileURLToPath(import.meta.url)) -const liquidVariableSyntax = /^{{\s*(.*)\s*}}/ - -// This class supports a set of link tags. Each tag expects one parameter, a language-agnostic href: -// -// {% link /articles/set-up-git %} -// -// {% link_in_list /articles/set-up-git %} -// -// {% link_with_intro /articles/set-up-git %} -// -// {% homepage_link_with_intro /articles/set-up-git %} -// -// Each tag renders a link to the given article using the article's `title` -// frontmatter data. The href and title are all dynamic based on the -// current language (English, Japanese, etc..) -// -// Liquid Docs: https://github.com/liquid-lang/liquid-node#registering-new-tags - -export default (name) => ({ - parse(tagToken) { - this.param = tagToken.args.trim() - }, - - async getTemplate() { - const pathToTemplate = path.join(__dirname, '../../includes/liquid-tags', `${name}.html`) - const template = await readFileAsync(pathToTemplate, 'utf8') - return template.replace(/\r/g, '') - }, - - async renderPageProps(page, ctx, props) { - const renderedProps = {} - - for (const propName in props) { - const { opt } = props[propName] || {} - renderedProps[propName] = await page.renderProp(propName, ctx, opt) - } - - return renderedProps - }, - - async render(scope) { - const template = await this.getTemplate() - - const ctx = scope.environments - - assert(ctx.page, 'context.page is required') - assert(ctx.page.relativePath, 'context.page.relativePath is required') - assert(ctx.pages, 'context.pages is required') - assert(ctx.currentLanguage, 'context.currentLanguage is required') - - // process any liquid in hrefs (e.g., /enterprise/{{ page.version }}) - let href = await this.liquid.parseAndRender(this.param, ctx) - if (href === '') { - const match = liquidVariableSyntax.exec(this.param) - if (match) { - href = await this.liquid.evalValue(match[1], scope) - } - } - - let fullPath = href - const dirName = path.dirname(ctx.page.relativePath) - - // if href contains one slash, assume it's a relative path and infer the full path - // example: /site-policy (linked to from /github/index.md) - // becomes: /github/site-policy - // otherwise, assume it's already a full path and needs nothing further - const hrefMatch = href.match(/\//g) - if (hrefMatch && hrefMatch.length < 2) { - fullPath = path.join(dirName, href) - } - - // add language code and version - fullPath = removeFPTFromPath( - path.posix.join( - '/', - ctx.currentLanguage, - ctx.currentVersion, - getPathWithoutLanguage(getPathWithoutVersion(fullPath)) - ) - ) - - // find the page based on the full path - const page = findPage(fullPath, ctx.pages, ctx.redirects) - - // return an empty string if it's a hidden link on a non-hidden page (hidden links on hidden pages are OK) - if (!page || (page.hidden && !ctx.page.hidden)) { - return '' - } - // also return early if the found page should not render in current version - if (!getApplicableVersions(page.versions).includes(ctx.currentVersion)) { - return '' - } - - // find and render the props - const renderedProps = await this.renderPageProps(page, ctx, { - title: { opt: { textOnly: true, encodeEntities: true } }, - intro: { opt: { unwrap: true } }, - }) - - const parsed = await this.liquid.parseAndRender(template, { fullPath, ...renderedProps }) - - return parsed.trim() - }, -}) diff --git a/lib/liquid-tags/topic-link-in-list.js b/lib/liquid-tags/topic-link-in-list.js deleted file mode 100644 index c22e21033d99..000000000000 --- a/lib/liquid-tags/topic-link-in-list.js +++ /dev/null @@ -1,2 +0,0 @@ -import link from './link.js' -export default link('topic-link-in-list') diff --git a/lib/render-content/index.js b/lib/render-content/index.js index ab8a2ad08a66..10c74ee33e87 100644 --- a/lib/render-content/index.js +++ b/lib/render-content/index.js @@ -1,25 +1,14 @@ import GithubSlugger from 'github-slugger' import renderContent from './renderContent.js' import { ExtendedMarkdown, tags } from '../liquid-tags/extended-markdown.js' -import Link from '../liquid-tags/link.js' -import LinkWithIntro from '../liquid-tags/link-with-intro.js' -import LinkInList from '../liquid-tags/link-in-list.js' -import TopicLinkInList from '../liquid-tags/topic-link-in-list.js' import IndentedDataReference from '../liquid-tags/indented-data-reference.js' import Data from '../liquid-tags/data.js' import Octicon from '../liquid-tags/octicon.js' -import LinkAsArticleCard from '../liquid-tags/link-as-article-card.js' import Ifversion from '../liquid-tags/ifversion.js' -// Include custom tags like {% link_with_intro /article/foo %} -renderContent.liquid.registerTag('link', Link('link')) -renderContent.liquid.registerTag('link_with_intro', LinkWithIntro) -renderContent.liquid.registerTag('link_in_list', LinkInList) -renderContent.liquid.registerTag('topic_link_in_list', TopicLinkInList) renderContent.liquid.registerTag('indented_data_reference', IndentedDataReference) renderContent.liquid.registerTag('data', Data) renderContent.liquid.registerTag('octicon', Octicon) -renderContent.liquid.registerTag('link_as_article_card', LinkAsArticleCard) renderContent.liquid.registerTag('ifversion', Ifversion) for (const tag in tags) { diff --git a/tests/rendering/curated-homepage-links.js b/tests/rendering/curated-homepage-links.js index 2a3850538810..e8ad018cf306 100644 --- a/tests/rendering/curated-homepage-links.js +++ b/tests/rendering/curated-homepage-links.js @@ -6,7 +6,7 @@ describe('curated homepage links', () => { test('English', async () => { const $ = await getDOM('/en') - const $links = $('a.link-with-intro') + const $links = $('a.Bump-link--hover') expect($links.length).toBeGreaterThanOrEqual(8) // Check that each link is localized and includes a title and intro @@ -32,7 +32,7 @@ describe('curated homepage links', () => { test('Japanese', async () => { const $ = await getDOM('/ja') - const $links = $('a.link-with-intro') + const $links = $('a.Bump-link--hover') expect($links.length).toBeGreaterThanOrEqual(8) // Check that each link is localized and includes a title and intro diff --git a/tests/unit/liquid-helpers.js b/tests/unit/liquid-helpers.js index c116096bd883..107c0bd6b763 100644 --- a/tests/unit/liquid-helpers.js +++ b/tests/unit/liquid-helpers.js @@ -1,9 +1,7 @@ import { jest } from '@jest/globals' import { liquid } from '../../lib/render-content/index.js' import { loadPageMap } from '../../lib/page-data.js' -import htmlEntities from 'html-entities' import nonEnterpriseDefaultVersion from '../../lib/non-enterprise-default-version.js' -const entities = new htmlEntities.XmlEntities() describe('liquid helper tags', () => { jest.setTimeout(60 * 1000) @@ -33,75 +31,6 @@ describe('liquid helper tags', () => { } }) - test('link tag with relative path (English)', async () => { - const template = '{% link /contributing-and-collaborating-using-github-desktop %}' - const expected = - 'Contributing and collaborating using GitHub Desktop' - const output = await liquid.parseAndRender(template, context) - expect(output).toBe(expected) - }) - - test('link tag with relative path (translated)', async () => { - context.currentLanguage = 'ja' - const template = '{% link /contributing-and-collaborating-using-github-desktop %}' - const expected = - '' - const output = await liquid.parseAndRender(template, context) - expect(output.includes(expected)).toBe(true) - // set this back to english - context.currentLanguage = 'en' - }) - - test('link tag with local variable', async () => { - const template = `{% assign href = "/contributing-and-collaborating-using-github-desktop" %} - {% link {{ href }} %}` - const expected = - '' - const output = await liquid.parseAndRender(template, context) - expect(output.includes(expected)).toBe(true) - }) - - test('link tag with absolute path', async () => { - context.currentLanguage = 'en' - const template = - '{% link /desktop/contributing-and-collaborating-using-github-desktop/adding-and-cloning-repositories %}' - const expected = - 'Adding and cloning repositories' - const output = await liquid.parseAndRender(template, context) - expect(output).toBe(expected) - }) - - test('link_with_intro tag', async () => { - const template = '{% link_with_intro /contributing-and-collaborating-using-github-desktop %}' - const page = pageMap['/en/desktop/contributing-and-collaborating-using-github-desktop'] - const expected = ` -

    ${page.title}→

    -     -

    ${page.intro}

    ` - const output = entities.decode(await liquid.parseAndRender(template, context)) - expect(output).toBe(expected) - }) - - test('link_in_list tag', async () => { - const template = '{% link_in_list /contributing-and-collaborating-using-github-desktop %}' - const expected = - '- Contributing and collaborating using GitHub Desktop' - const output = await liquid.parseAndRender(template, context) - expect(output).toBe(expected) - }) - - test('link_as_article_card', async () => { - const template = - '{% link_as_article_card /contributing-and-collaborating-using-github-desktop %}' - const expected = `
    - -

    Contributing and collaborating using GitHub Desktop

    -
    -

    Use GitHub Desktop to manage your projects, create meaningful commits, and track the project's history in an app instead of on the command line.

    ` - const output = await liquid.parseAndRender(template, context) - expect(output.includes(expected)).toBe(true) - }) - describe('indented_data_reference tag', () => { test('without any number of spaces specified', async () => { const template = '{% indented_data_reference reusables.example %}'