Skip to content

Commit cb19125

Browse files
committed
fix: improve caption handling
(but still just goes to alt, which isn't useful)
1 parent 295c02a commit cb19125

File tree

2 files changed

+24
-7
lines changed

2 files changed

+24
-7
lines changed

src/NotionImage.spec.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,16 +13,17 @@ test("primary caption content after image links are removed", async () => {
1313
const img = parseImageBlock(
1414
kImageBlockWithTwoLocalizedImagesWrappedWithActualCaptionText
1515
);
16-
expect(img.caption).toBe("Caption before images.\nCaption after images.");
16+
// carriage returns seem to mess up the markdown, so should be removed
17+
expect(img.caption).toBe("Caption before images. Caption after images.");
1718
});
1819

1920
test("gets localized image links", async () => {
2021
const img = parseImageBlock(
2122
kImageBlockWithTwoLocalizedImagesWrappedWithActualCaptionText
2223
);
2324
expect(img.localizedUrls.length).toBe(2);
24-
expect(img.localizedUrls[0].iso632Code).toBe("FR");
25-
expect(img.localizedUrls[1].iso632Code).toBe("ES");
25+
expect(img.localizedUrls[0].iso632Code).toBe("fr");
26+
expect(img.localizedUrls[1].iso632Code).toBe("es");
2627
expect(img.localizedUrls[0].url).toBe("https://i.imgur.com/pYmE7OJ.png");
2728
expect(img.localizedUrls[1].url).toBe("https://i.imgur.com/8paSZ0i.png");
2829
});

src/NotionImage.ts

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -124,13 +124,16 @@ export function parseImageBlock(b: any): ImageSet {
124124
const match = /\s*(..)\s*(https:\/\/.*)/.exec(l);
125125
if (match) {
126126
imageSet.localizedUrls.push({
127-
iso632Code: match[1].toUpperCase(),
127+
iso632Code: match[1].toLowerCase(),
128128
url: match[2],
129129
});
130130
} else {
131-
imageSet.caption += l + "\n";
131+
// NB: carriage returns seem to mess up the markdown, so should be removed
132+
imageSet.caption += l + " ";
132133
}
133134
});
135+
// NB: currently notion-md puts the caption in Alt, which noone sees (unless the image isn't found)
136+
// We could inject a custom element handler to emit a <figure> in order to show the caption.
134137
imageSet.caption = imageSet.caption?.trim();
135138
//console.log(JSON.stringify(imageSet, null, 2));
136139

@@ -141,16 +144,29 @@ export function parseImageBlock(b: any): ImageSet {
141144
// change the src to point to our copy of the image.
142145
export async function processImageBlock(b: any): Promise<void> {
143146
//console.log(JSON.stringify(b));
144-
const img = parseImageBlock(b);
147+
const imageSet = parseImageBlock(b);
145148

146-
const newPath = imagePrefix + "/" + (await saveImage(img, imageOutputPath));
149+
const newPath =
150+
imagePrefix + "/" + (await saveImage(imageSet, imageOutputPath));
147151

148152
// change the src to point to our copy of the image
149153
if ("file" in b.image) {
150154
b.image.file.url = newPath;
151155
} else {
152156
b.image.external.url = newPath;
153157
}
158+
// put back the simplified caption, stripped of the meta information
159+
if (imageSet.caption) {
160+
b.image.caption = [
161+
{
162+
type: "text",
163+
text: { content: imageSet.caption, link: null },
164+
plain_text: imageSet.caption,
165+
},
166+
];
167+
} else {
168+
b.image.caption = [];
169+
}
154170
}
155171

156172
function imageWasSeen(path: string) {

0 commit comments

Comments
 (0)