Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(content-blog): links in feed should be absolute #9151

Merged
merged 20 commits into from
Aug 3, 2023
Merged

fix(content-blog): links in feed should be absolute #9151

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
b607956
fix: #9136:fix(content-blog): links in feed should be absolute
VinceCYLiao Jul 18, 2023
a339fc9
feat: add test to check if links in feed are resolved correctly (+2 s…
Jul 19, 2023
e65995e
feat: absolutize img URLs
VinceCYLiao Jul 23, 2023
aaa869a
chore: remove test case added in previous commit
VinceCYLiao Jul 23, 2023
af9cbe2
chore: update fixture
VinceCYLiao Jul 23, 2023
10ba5cb
chore: add for cSpell
VinceCYLiao Jul 23, 2023
6a8345d
feat: update test cases as added on new fixture file and update snapshot
VinceCYLiao Jul 23, 2023
84493db
chore: correct order of front matter and imports
VinceCYLiao Aug 3, 2023
f382af6
feat: use srcset lib to parse urls in img's srcset and make them abso…
VinceCYLiao Aug 3, 2023
08e17db
chore: update snapshot
VinceCYLiao Aug 3, 2023
df68905
chore: remove console.log
VinceCYLiao Aug 3, 2023
646d22a
chore: remove unneeded export declaration
VinceCYLiao Aug 3, 2023
d34fda6
Update packages/docusaurus-plugin-content-blog/src/feed.ts
slorber Aug 3, 2023
0016a18
Update packages/docusaurus-plugin-content-blog/src/feed.ts
slorber Aug 3, 2023
2158d7c
simplify impl
slorber Aug 3, 2023
a62b99f
Merge branch 'main' into fix/issue#9136
slorber Aug 3, 2023
c04e223
replace docusaurus.png
slorber Aug 3, 2023
0afae8b
improve blog-with-links.mdx file links
slorber Aug 3, 2023
1f8dfad
regenerate build-snap
slorber Aug 3, 2023
da0fb44
Update feed snapshots
slorber Aug 3, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions ...plugin-content-blog/src/__tests__/__fixtures__/website/blog/blog-with-links.mdx
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

31 changes: 31 additions & 0 deletions ...ontent-blog/src/__tests__/__fixtures__/website/build-snap/blog/blog-with-links/index.html
View file
Open in desktop

Large diffs are not rendered by default.

149 changes: 111 additions & 38 deletions packages/docusaurus-plugin-content-blog/src/__tests__/__snapshots__/feed.test.ts.snap
View file
Open in desktop

Large diffs are not rendered by default.

19 changes: 11 additions & 8 deletions packages/docusaurus-plugin-content-blog/src/__tests__/index.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -325,29 +325,32 @@ describe('blog plugin', () => {
it('builds simple website blog with localized dates', async () => {
const siteDir = path.join(__dirname, '__fixtures__', 'website');
const blogPostsFrench = await getBlogPosts(siteDir, {}, getI18n('fr'));
expect(blogPostsFrench).toHaveLength(9);
expect(blogPostsFrench).toHaveLength(10);
expect(blogPostsFrench[0]!.metadata.formattedDate).toMatchInlineSnapshot(
`"6 mars 2021"`,
`"23 juillet 2023"`,
);
expect(blogPostsFrench[1]!.metadata.formattedDate).toMatchInlineSnapshot(
`"5 mars 2021"`,
`"6 mars 2021"`,
);
expect(blogPostsFrench[2]!.metadata.formattedDate).toMatchInlineSnapshot(
`"16 août 2020"`,
`"5 mars 2021"`,
);
expect(blogPostsFrench[3]!.metadata.formattedDate).toMatchInlineSnapshot(
`"15 août 2020"`,
`"16 août 2020"`,
);
expect(blogPostsFrench[4]!.metadata.formattedDate).toMatchInlineSnapshot(
`"27 février 2020"`,
`"15 août 2020"`,
);
expect(blogPostsFrench[5]!.metadata.formattedDate).toMatchInlineSnapshot(
`"27 février 2020"`,
);
expect(blogPostsFrench[6]!.metadata.formattedDate).toMatchInlineSnapshot(
`"2 janvier 2019"`,
`"27 février 2020"`,
);
expect(blogPostsFrench[7]!.metadata.formattedDate).toMatchInlineSnapshot(
`"2 janvier 2019"`,
);
expect(blogPostsFrench[8]!.metadata.formattedDate).toMatchInlineSnapshot(
`"1 janvier 2019"`,
);
});
Expand Down Expand Up @@ -377,7 +380,7 @@ describe('blog plugin', () => {
expect(blogPost.metadata.editUrl).toEqual(hardcodedEditUrl);
});

expect(editUrlFunction).toHaveBeenCalledTimes(9);
expect(editUrlFunction).toHaveBeenCalledTimes(10);

expect(editUrlFunction).toHaveBeenCalledWith({
blogDirPath: 'blog',
Expand Down
29 changes: 28 additions & 1 deletion packages/docusaurus-plugin-content-blog/src/feed.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ async function generateBlogFeed({
return feed;
}

async function defaultCreateFeedItems({
export async function defaultCreateFeedItems({
blogPosts,
siteConfig,
outDir,
Expand Down Expand Up @@ -106,6 +106,33 @@ async function defaultCreateFeedItems({
const $ = cheerioLoad(content);

const link = normalizeUrl([siteUrl, permalink]);

$(`div#${blogPostContainerID} a, div#${blogPostContainerID} img`).each(
(_, elm) => {
if (elm.tagName === 'a') {
const {href} = elm.attribs;
if (href) {
elm.attribs.href = String(new URL(href, link));
}
} else if (elm.tagName === 'img') {
const {src, srcset} = elm.attribs;
if (src) {
elm.attribs.src = String(new URL(src, link));
}
if (srcset) {
elm.attribs.srcset = srcset
.split(',')
.map((s) => {
const [imageURL, ...descriptors] = s.trim().split(/\s+/);
const newImageURL = new URL(imageURL ?? '', link).href;
return [newImageURL, ...descriptors].join(' ');
})
.join(', ');
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks a bit unsafe/risky, maybe introduce a dedicated lib to manipulate srcset reliably instead? see https://www.npmjs.com/package/srcset

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks. I'll look into it and revise my code

Copy link
Contributor Author

@VinceCYLiao VinceCYLiao Aug 3, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done and since latest version of srcset is pure ESM, so I have to use the previous version.

}
}
},
);

const feedItem: BlogFeedItem = {
title: metadataTitle,
id: link,
Expand Down
1 change: 1 addition & 0 deletions project-words.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,7 @@ jodyheavener
joshcena
jscodeshift
jssdk
juillet
kaszubowski
katex
kato
Expand Down
9 changes: 9 additions & 0 deletions website/_dogfooding/_blog tests/2023-07-19-a.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
---
title: 'Test if href in feed resolved correctly'
---

[absolute full url](https://github.com/facebook/docusaurus)

[absolute url with implicit domain name](/tests/blog/2023/07/19/b)

[relative url](2023-07-19-b.mdx)
1 change: 1 addition & 0 deletions website/_dogfooding/_blog tests/2023-07-19-b.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
# Test Relative Path