diff --git a/news/changelog-1.9.md b/news/changelog-1.9.md index 9c327bc5e1d..e5ae86f20ac 100644 --- a/news/changelog-1.9.md +++ b/news/changelog-1.9.md @@ -79,6 +79,7 @@ All changes included in 1.9: - ([#13570](https://github.com/quarto-dev/quarto-cli/pull/13570)): Replace Twitter with Bluesky in default blog template and documentation examples. New blog projects now include Bluesky social links instead of Twitter. - ([#13716](https://github.com/quarto-dev/quarto-cli/issues/13716)): Fix draft pages showing blank during preview when pre-render scripts are configured. - ([#13847](https://github.com/quarto-dev/quarto-cli/pull/13847)): Open graph title with markdown is now processed correctly. (author: @mcanouil) +- ([#12293](https://github.com/quarto-dev/quarto-cli/pull/12293)): Add support for `target` attribute on listing item links. Users can specify `target: "_blank"` in listing item YAML to open links in a new tab. Works with default, grid, and table listing types. (author: @mcanouil) ### `book` diff --git a/src/project/types/website/listing/website-listing-read.ts b/src/project/types/website/listing/website-listing-read.ts index c8aacd50096..8375f898f33 100644 --- a/src/project/types/website/listing/website-listing-read.ts +++ b/src/project/types/website/listing/website-listing-read.ts @@ -557,7 +557,7 @@ function hydrateListing( // If the items have come from metadata, we should just show // all the columns in the table. Otherwise, we should use the // document default columns - const undisplayable = ["path"]; + const undisplayable = ["path", "target"]; return itemFields.filter((field) => { return !undisplayable.includes(field); }); diff --git a/src/project/types/website/listing/website-listing-template.ts b/src/project/types/website/listing/website-listing-template.ts index 50a538b23aa..6bf14c8d0a9 100644 --- a/src/project/types/website/listing/website-listing-template.ts +++ b/src/project/types/website/listing/website-listing-template.ts @@ -404,7 +404,9 @@ export function reshapeListing( const value = val || item[field] || " "; const path = item.path; if (path && value !== undefined && fieldLinks.includes(field)) { - return `${value}`; } else { diff --git a/src/resources/projects/website/listing/item-default.ejs.md b/src/resources/projects/website/listing/item-default.ejs.md index 91114a7867f..d17fbf95c58 100644 --- a/src/resources/projects/website/listing/item-default.ejs.md +++ b/src/resources/projects/website/listing/item-default.ejs.md @@ -32,7 +32,7 @@ return value; let value = readField(item, field); if (value !== undefined) { print(`
${listing.utilities.outputLink(item, field, value)}
`); - } +} } %> @@ -41,7 +41,7 @@ print(`
${listing.utilities.outputLi <% if (fields.includes('image')) { %> ```{=html} -
+
<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="no-external"> <% if (item.image) { %> <%= listing.utilities.img(itemNumber, item.image, "thumbnail-image", item['image-alt'], item['image-lazy-loading'] ?? listing['image-lazy-loading']) %> <% } else { %> @@ -55,9 +55,9 @@ print(`
${listing.utilities.outputLi ::: {.body} <% if (fields.includes('title')) { %> -

<%= item.title %>

+

<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="no-external"><%= item.title %>

<% if (fields.includes('subtitle')) { %> -
<%= item.subtitle %>
+
<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="no-external"><%= item.subtitle %>
<% } %> <% } %> @@ -76,7 +76,7 @@ print(`
${listing.utilities.outputLi <% if (fields.includes('description')) { %> ```{=html} -
+
<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="no-external"> ``` <%= item.description %> @@ -92,7 +92,7 @@ print(`
${listing.utilities.outputLi ::: {.metadata} ```{=html} - +<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="no-external"> ``` <% if (fields.includes('date') && item.date) { %> diff --git a/src/resources/projects/website/listing/item-grid.ejs.md b/src/resources/projects/website/listing/item-grid.ejs.md index e19307988d9..288c1a03073 100644 --- a/src/resources/projects/website/listing/item-grid.ejs.md +++ b/src/resources/projects/website/listing/item-grid.ejs.md @@ -40,7 +40,7 @@ return !["title", "image", "image-alt", "date", "author", "subtitle", "descripti ::: {.g-col-1 <%= listing.utilities.metadataAttrs(item) %> } ```{=html} - +<%= item.target === "_blank" ? ` rel="noopener"` : "" %> class="quarto-grid-link">
``` diff --git a/src/resources/projects/website/listing/listing-table.ejs.md b/src/resources/projects/website/listing/listing-table.ejs.md index d45de6ccf91..f5c6902fe2c 100644 --- a/src/resources/projects/website/listing/listing-table.ejs.md +++ b/src/resources/projects/website/listing/listing-table.ejs.md @@ -26,7 +26,7 @@ return false; const hoverCls = listing['table-hover'] ? " table-hover" : ""; const onclick = (item) => { if (listing['table-hover']) { -return ` onclick="href = this.querySelector('a').getAttribute('href');\n if (href) { window.location=href ; return false; }"`; +return ` onclick="var a = this.querySelector('a'); var href = a.getAttribute('href'); var target = a.getAttribute('target'); if (href) { if (target === '_blank') { window.open(href, '_blank'); } else { window.location = href; } return false; }"`; } else { return ""; } diff --git a/tests/docs/smoke-all/listings/target-attribute/.gitignore b/tests/docs/smoke-all/listings/target-attribute/.gitignore new file mode 100644 index 00000000000..474ea9df16f --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/.gitignore @@ -0,0 +1,4 @@ +_site/ +.quarto/ +/.quarto/ +**/*.quarto_ipynb diff --git a/tests/docs/smoke-all/listings/target-attribute/_quarto.yml b/tests/docs/smoke-all/listings/target-attribute/_quarto.yml new file mode 100644 index 00000000000..fdabc8717b4 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/_quarto.yml @@ -0,0 +1,10 @@ +project: + type: website + +website: + title: "Target Attribute Test" + +format: + html: + theme: cosmo + toc: true diff --git a/tests/docs/smoke-all/listings/target-attribute/index-default-metadata.qmd b/tests/docs/smoke-all/listings/target-attribute/index-default-metadata.qmd new file mode 100644 index 00000000000..e8ce4118d3d --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-default-metadata.qmd @@ -0,0 +1,23 @@ +--- +listing: + type: default + contents: + - title: "Post with target" + path: posts/post-with-target.qmd + target: "_blank" + - title: "Post without target" + path: posts/post-without-target.qmd +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" + ensureHtmlElementCount: + selectors: ['.listing-target'] + counts: [0] +--- + +## Default listing with metadata specification test diff --git a/tests/docs/smoke-all/listings/target-attribute/index-default.qmd b/tests/docs/smoke-all/listings/target-attribute/index-default.qmd new file mode 100644 index 00000000000..dc33d1b648b --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-default.qmd @@ -0,0 +1,15 @@ +--- +listing: + type: default + contents: posts/*.qmd +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" +--- + +## Default listing with target attribute test diff --git a/tests/docs/smoke-all/listings/target-attribute/index-grid-metadata.qmd b/tests/docs/smoke-all/listings/target-attribute/index-grid-metadata.qmd new file mode 100644 index 00000000000..9ffb229fa73 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-grid-metadata.qmd @@ -0,0 +1,23 @@ +--- +listing: + type: grid + contents: + - title: "Post with target" + path: posts/post-with-target.qmd + target: "_blank" + - title: "Post without target" + path: posts/post-without-target.qmd +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" + ensureHtmlElementCount: + selectors: ['.listing-target'] + counts: [0] +--- + +## Grid listing with metadata specification test diff --git a/tests/docs/smoke-all/listings/target-attribute/index-grid.qmd b/tests/docs/smoke-all/listings/target-attribute/index-grid.qmd new file mode 100644 index 00000000000..4087b0715b8 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-grid.qmd @@ -0,0 +1,15 @@ +--- +listing: + type: grid + contents: posts/*.qmd +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" +--- + +## Grid listing with target attribute test diff --git a/tests/docs/smoke-all/listings/target-attribute/index-table-metadata.qmd b/tests/docs/smoke-all/listings/target-attribute/index-table-metadata.qmd new file mode 100644 index 00000000000..9d7bf7af733 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-table-metadata.qmd @@ -0,0 +1,25 @@ +--- +listing: + type: table + contents: + - title: "Post with target" + path: posts/post-with-target.qmd + target: "_blank" + - title: "Post without target" + path: posts/post-without-target.qmd + table-hover: true +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" + - "tr[onclick*='window.open']" + ensureHtmlElementCount: + selectors: ['.listing-target'] + counts: [0] +--- + +## Table listing with metadata specification test diff --git a/tests/docs/smoke-all/listings/target-attribute/index-table.qmd b/tests/docs/smoke-all/listings/target-attribute/index-table.qmd new file mode 100644 index 00000000000..dca59a96cf8 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/index-table.qmd @@ -0,0 +1,17 @@ +--- +listing: + type: table + contents: posts/*.qmd + table-hover: true +_quarto: + tests: + html: + noErrors: true + ensureHtmlElements: + - + - "a[href$='post-with-target.html'][target='_blank'][rel='noopener']" + - "a[href$='post-without-target.html']:not([target]):not([rel])" + - "tr[onclick*='window.open']" +--- + +## Table listing with target attribute test diff --git a/tests/docs/smoke-all/listings/target-attribute/posts/post-with-target.qmd b/tests/docs/smoke-all/listings/target-attribute/posts/post-with-target.qmd new file mode 100644 index 00000000000..cb16d424646 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/posts/post-with-target.qmd @@ -0,0 +1,6 @@ +--- +title: Post with target blank +target: "_blank" +--- + +This post should open in a new tab. diff --git a/tests/docs/smoke-all/listings/target-attribute/posts/post-without-target.qmd b/tests/docs/smoke-all/listings/target-attribute/posts/post-without-target.qmd new file mode 100644 index 00000000000..cccb615c535 --- /dev/null +++ b/tests/docs/smoke-all/listings/target-attribute/posts/post-without-target.qmd @@ -0,0 +1,5 @@ +--- +title: Post without target +--- + +This post should open in the same tab.