feat(route): fetch full content for changelog items (#20953)

* feat(perplexity): fetch full content for changelog items

- Fetch full article content for each changelog item
- Use Puppeteer to render JavaScript-rendered pages
- Remove hero image from description
- Cache parsed content using cache.tryGet

* fix(perplexity): resolve review comments
- Simplify CSS selector for content extraction
- Fix dangling promises issue by properly returning and using Promise results
- Ensure cache mechanism works correctly by returning new objects instead of mutating
- Remove redundant fallback logic

Author: xbot

lib/routes/perplexity/changelog.ts

@@ -3,6 +3,7 @@ import type { Context } from 'hono';
 
 import type { Data, DataItem, Route } from '@/types';
 import { ViewType } from '@/types';
+import cache from '@/utils/cache';
 import logger from '@/utils/logger';
 import { parseDate } from '@/utils/parse-date';
 import { getPuppeteerPage } from '@/utils/puppeteer';
@@ -15,17 +16,16 @@ export const handler = async (ctx: Context): Promise<Data> => {
 
     logger.http(`Fetching Perplexity changelog from ${targetUrl}`);
 
-    const { page, destory } = await getPuppeteerPage(targetUrl, {
+    const { page, destory, browser } = await getPuppeteerPage(targetUrl, {
         onBeforeLoad: async (page) => {
             await page.setRequestInterception(true);
             page.on('request', (request) => {
                 request.resourceType() === 'document' ? request.continue() : request.abort();
             });
         },
     });
-    const html = await page.evaluate(() => document.documentElement.innerHTML);
-    await destory();
 
+    const html = await page.evaluate(() => document.documentElement.innerHTML);
     const $ = load(html);
     const language = $('html').attr('lang') ?? 'en';
 
@@ -94,11 +94,53 @@ export const handler = async (ctx: Context): Promise<Data> => {
         })
         .filter((item): item is DataItem => item !== null);
 
+    // Fetch full content for each item using the same browser session
+    const resultItems = await Promise.all(
+        items.slice(0, limit).map(async (item) => {
+            if (!item.link) {
+                return item;
+            }
+            return await cache.tryGet(item.link, async () => {
+                logger.http(`Fetching full content for ${item.link!}`);
+
+                // Create a new page in the same browser session
+                const contentPage = await browser.newPage();
+
+                // Set request interception for this page
+                await contentPage.setRequestInterception(true);
+                contentPage.on('request', (request) => {
+                    request.resourceType() === 'document' ? request.continue() : request.abort();
+                });
+
+                // Navigate to the item link
+                await contentPage.goto(item.link!, { waitUntil: 'domcontentloaded' });
+
+                const contentHtml = await contentPage.evaluate(() => document.documentElement.innerHTML);
+                await contentPage.close();
+
+                const $content = load(contentHtml);
+
+                // Find the main article content - RichTextContainer with substantial text
+                // Look for elements with framer-text class containing actual content
+                const contentContainer = $content('div#main > div > div > div[data-framer-component-type="RichTextContainer"]').first();
+                const fullContent = contentContainer.html()?.trim() || '';
+
+                return {
+                    ...item,
+                    description: fullContent || item.description,
+                };
+            });
+        })
+    );
+
+    // Close the browser session after all requests are done
+    await destory();
+
     return {
         title: $('title').text() || 'Perplexity Changelog',
         description: $('meta[name="description"], meta[property="og:description"]').first().attr('content') || 'Latest updates and changes from Perplexity',
         link: targetUrl,
-        item: items.slice(0, limit),
+        item: resultItems,
         allowEmpty: true,
         image: $('meta[property="og:image"]').attr('content'),
         language: language as 'en',