starred/karakeep

Fork 0

mirror of https://github.com/karakeep-app/karakeep.git synced 2026-04-26 00:16:03 +03:00

[GH-ISSUE #143] Take full page screenshots #117

New issue

Closed

opened 2026-03-02 11:46:47 +03:00 by kerem · 6 comments

kerem commented

2026-03-02 11:46:47 +03:00

Owner

Originally created by @kamtschatka on GitHub (May 9, 2024).
Original GitHub issue: https://github.com/karakeep-app/karakeep/issues/143

Taking a screenshot of the page would be much better if it would take a full page screenshot.
If I am not mistaken it should only require a change in this line to add "fullpage: true"

Originally created by @kamtschatka on GitHub (May 9, 2024). Original GitHub issue: https://github.com/karakeep-app/karakeep/issues/143 Taking a screenshot of the page would be much better if it would take a full page screenshot. If I am not mistaken it should only require a change in [this line](https://github.com/MohamedBassem/hoarder-app/blob/edf5fdbec67278e81c3538a553d567ff0a37d798/apps/workers/crawlerWorker.ts#L230) to add ["fullpage: true" ](https://www.webshare.io/academy-article/puppeteer-screenshot#how-to-screenshot-the-full-page)

kerem

2026-03-02 11:46:47 +03:00

closed this issue
added the
feature request
label

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@kamtschatka commented on GitHub (May 10, 2024):

Yeah I tried it out and it works fine, but I can't figure out how to make the screenshot show up correctly.
Tried all kinds of things with ScreenshotSection.tsx, but the screenshot stays like this:

If I remove the "height: 100%" style from the create image tag it looks fine, but I don't understand how that works with the "Image" tag from next:

@kamtschatka commented on GitHub (May 10, 2024): Yeah I tried it out and it works fine, but I can't figure out how to make the screenshot show up correctly. Tried all kinds of things with ScreenshotSection.tsx, but the screenshot stays like this: ![image](https://github.com/MohamedBassem/hoarder-app/assets/22147234/e33cfe75-d819-424b-8e30-65c129b165c5) If I remove the "height: 100%" style from the create image tag it looks fine, but I don't understand how that works with the "Image" tag from next: ![image](https://github.com/MohamedBassem/hoarder-app/assets/22147234/3a347208-ddf6-4625-9d78-bff1bdc5e33f)

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@scubanarc commented on GitHub (May 10, 2024):

I didn't look at the source, but it seems like some sort of height-limited div with "overflow:hidden" might to do the trick.

@scubanarc commented on GitHub (May 10, 2024): I didn't look at the source, but it seems like some sort of height-limited div with "overflow:hidden" might to do the trick.

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@MohamedBassem commented on GitHub (May 10, 2024):

Yeah, dealing with the Image tag of next can be very annoying :) I'll check it over the weekend.

I think also I'll also make this behavior configurable. Screenshots can take a ton of disk space specially with that size and not everyone finds them useful.

@MohamedBassem commented on GitHub (May 10, 2024): Yeah, dealing with the `Image` tag of next can be very annoying :) I'll check it over the weekend. I think also I'll also make this behavior configurable. Screenshots can take a ton of disk space specially with that size and not everyone finds them useful.

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@kamtschatka commented on GitHub (May 10, 2024):

I found the solution here and opened a PR.
You mentioned making that configurable. You mean with an environment variable or in the UI?

@kamtschatka commented on GitHub (May 10, 2024): I found the solution [here ](https://github.com/vercel/next.js/discussions/18474#discussioncomment-5501724) and opened a PR. You mentioned making that configurable. You mean with an environment variable or in the UI?

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@MohamedBassem commented on GitHub (May 10, 2024):

Nice! will check it out!

By configurable, I mean with an env variable. All config knobs are here: https://github.com/MohamedBassem/hoarder-app/blob/main/packages/shared/config.ts and you'll find this serverConfig option used a lot in the crawlerWorker.ts already. And if it's not too much, I'd be grateful if you add the new env variable to the docs here as well https://github.com/MohamedBassem/hoarder-app/blob/main/docs/docs/03-configuration.md :) I think we can name it CRAWLER_FULL_PAGE_SCREENSHOT.

@MohamedBassem commented on GitHub (May 10, 2024): Nice! will check it out! By configurable, I mean with an env variable. All config knobs are here: https://github.com/MohamedBassem/hoarder-app/blob/main/packages/shared/config.ts and you'll find this `serverConfig` option used a lot in the `crawlerWorker.ts` already. And if it's not too much, I'd be grateful if you add the new env variable to the docs here as well https://github.com/MohamedBassem/hoarder-app/blob/main/docs/docs/03-configuration.md :) I think we can name it `CRAWLER_FULL_PAGE_SCREENSHOT`.

kerem commented

2026-03-02 11:46:48 +03:00

Author

Owner

@MohamedBassem commented on GitHub (May 12, 2024):

@kamtschatka implemented in #148!

@MohamedBassem commented on GitHub (May 12, 2024): @kamtschatka implemented in #148!

kerem referenced this issue

2026-03-02 11:58:03 +03:00

[PR #117] [MERGED] Disable meilisearch analytics #1529

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

starred/karakeep#117

No description provided.

Rows
Columns