Editing a GIF, BMP, ICO or SVG writes PNG bytes under the original name

クローズ
  • 何か問題がありますか？
#48 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
50/100
issue の種類
バグ
明瞭さ
おおむね明確
活発さ
活発
技術スタック
typescript
領域
frontend

調査の方向性

images.ts:94 と lib/components/ImageEditor.vue:46 から始め、ExportResult と props.file.encodedSource を経由して onSave を追跡してください。サポートされていない形式で編集機能を失わせるか、新しい一致する名前で保存するかを選択する前に、列挙された MIME タイプの挙動を確認してください。完了の条件は、編集によって元の名前で互換性のないバイト列を書き込めないこと、および JPEG/WebP の品質の一致が維持されることです。

索引モデルが issue の本文から書いたものです。

説明

AI assisted status: triage type: bug

images.ts:94 sets canEdit: true for the whole image handler, so the Edit button is offered on all 13 mimes it registers: image/apng, image/bmp, image/gif, image/jpeg, image/png, image/svg+xml, image/webp, image/x-icon, and image/heic, image/heif, image/tiff, image/x-xbitmap, image/emf where the server generates previews for them.

@nextcloud/image-editor can only write three. ExportOptions.format is typed 'image/png' | 'image/jpeg' | 'image/webp', and the viewer narrows it further at lib/components/ImageEditor.vue:46:

const exportOptions = computed<ExportOptions>(() => {
	if (props.file.mime === 'image/jpeg' || props.file.mime === 'image/webp') {
		return { format: props.file.mime, quality: 0.9 }
	}
	return { format: 'image/png' }
})

So editing a GIF produces PNG bytes, and onSave PUTs them to props.file.encodedSource, which is the original name. holiday.gif afterwards contains a PNG. Same for BMP, ICO, APNG (which loses its animation on the way through the canvas), TIFF, HEIC and, worst of the set, SVG, where a vector file comes back as a raster one under a .svg name.

ExportResult already carries mimeType, and the save path ignores it.

[!NOTE]
I have read this off the code path rather than reproduced it against a server, so the exact behaviour per mime is worth confirming before picking a fix.

Roughly, the options are to stop offering the edit where the format cannot be written back (narrow canEdit to the three, or make it per-mime rather than per-handler), or to save under a new name with the extension that matches what was actually encoded and leave the original alone. The second keeps the feature for more files but turns a save into a create, which the user should be told about rather than discover.

Second thing, same lines. The quality: 0.9 above overrides the quality matching in the editor's export. Left alone, qualityFor(source) reads the source's own quantization tables and writes the new file at the quality the old one was written at, held between 0.75 and 0.97. Passing an explicit 0.9 defeats that for every JPEG and WebP the viewer saves: a photo written at 0.95 loses more than it needs to, one written at 0.80 is re-saved larger than it needs to be. Dropping the quality key restores the matching, since options.quality is only consulted when set.

主要言語
TypeScript
スター
2
フォーク
1
平均マージ
19時間 47分
マージ済み PR（30日）
78

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

nextcloud-libraries/nextcloud-viewer のほかの issue

nextcloud-libraries/nextcloud-viewer の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。