Hacktoberfest 2026：维护者为十月标记出来的 issue，仍然开放、适合新手。 浏览 Hacktoberfest issue

A fractional width like `width=600.5` returns the full 1200x630 image

已关闭 适合新手
  • 哪里不对？
#167 1 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
88/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
typescript
领域
api, backend, testing

调研方向

阅读 src/lib/api-validation.ts 中的 resolveDimensions 及其在 tests/api/og.test.ts 中的测试；issue 指出了小数宽度的处理路径和预期尺寸。在尺寸解析器和 API 路由中补充小数宽度的测试，然后确保列出的检查、测试和构建命令均通过。完成的标准是：小数宽度的响应符合验收标准，同时保留现有的整数宽度和小数高度行为。

由索引模型根据 Issue 内容生成。

描述

bug good first issue hacktoberfest

On dev, /api/og?width=600 returns a 600x315 PNG, but /api/og?width=600.5 returns 1200x630, and so does width=333.3. Run npm run dev and open http://localhost:4321/api/og?width=600.5 to see it.

The schema accepts any number from 200 to 2400 (src/lib/api-validation.ts, lines 16 to 19), and resolveDimensions (line 46) keeps the fraction. src/pages/api/og.ts passes the width to the renderer as scaleDown (line 82), which becomes resvg's fitTo width (src/lib/og-engine.ts, lines 88 to 91). resvg-wasm 2.6.2 ignores a fitTo width that isn't a whole number and renders the SVG at its own size, 1200x630. width=600.0 works because it parses to 600.

A fractional height on its own is fine, because the width derived from it is rounded (line 74): height=315.5 gives 601x316.

This came in with #142 (the fix for #85), which isn't released yet. Production still runs v1.6.0, where width crops the canvas instead of scaling it, and there width=600.5 gives a 601x630 image. The next release is planned for Friday, so it would be good to fix this before then.

What to do

  • Round the width to a whole number at the start of resolveDimensions. Then width=600.5 works like width=601 and gives 601x316. The height doesn't need it: only the width goes to the renderer, and a width derived from height is already rounded.
  • Round instead of rejecting fractions with .int(). Production accepts width=600.5 today and returns an image, so a 400 would break URLs that work now.

Where to look

  • src/lib/api-validation.ts: the width and height schema (lines 16 to 23) and resolveDimensions (lines 46 to 96)
  • src/pages/api/og.ts: scaleDown (line 82)
  • src/lib/og-engine.ts: fitTo (lines 88 to 91)
  • tests/api/og.test.ts: the resolveDimensions tests (line 102) and the route tests for sizes (line 361)

Acceptance criteria

  • /api/og?width=600.5 returns a 601x316 PNG, and width=333.3 returns 333x175
  • height=315.5 still returns 601x316, and whole numbers work as before
  • Tests for fractional widths in resolveDimensions and in the route
  • npm run check, npm run test and npm run build pass

Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off dev, and open your PR against dev with Closes #167 in the description.

主要语言
TypeScript
星标
8
派生
4
平均合并
5 小时 44 分钟
30 天内合并 PR
83

环境准备

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

codercops/ogcops 的其他 Issue

查看 codercops/ogcops 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。