The filename variable is never stored when uploading. The export function reads currentFileName but it was never assigned → undefined → "undefined.png".
let currentFileName = 'untitled';
fileInput.addEventListener('change', (event) => {
const file = event.target.files[0];
currentFileName = file.name; // "vacation.jpg"
// ... rest of upload logic
});
function generateExportName(originalName, format = 'png') {
const dotIndex = originalName.lastIndexOf('.');
const name = dotIndex > 0
? originalName.slice(0, dotIndex)
: originalName;
const now = new Date();
const date = now.toISOString().slice(0, 10); // "2026-02-18"
return `${name}_edited_${date}.${format}`;
}
// "vacation.jpg" → "vacation_edited_2026-02-18.png"
| Method | What It Does | Example |
|---|---|---|
| .lastIndexOf('.') | Finds last dot position | "photo.raw.jpg" → 9 |
| .slice(0, dotIndex) | Extracts name without extension | "photo.raw" |
| .toISOString() | Date as standard string | "2026-02-18T..." |
| .slice(0, 10) | First 10 characters | "2026-02-18" |
exportBtn.addEventListener('click', () => {
const exportName = generateExportName(currentFileName, 'png');
canvas.toBlob((blob) => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = exportName;
link.click();
URL.revokeObjectURL(url);
showToast(`Exported as ${exportName}`, 'success');
}, 'image/png');
});
| Edge Case | Problem | Solution |
|---|---|---|
| "file.name.with.dots.jpg" | Multiple dots | lastIndexOf finds last dot |
| "my vacation photo.png" | Spaces in name | Replace with underscores |
| "résumé.png" | Accented characters | Allow or transliterate |
| No extension | dotIndex === -1 | Use full name as base |
Remove characters that break on different operating systems:
function sanitizeFilename(name) {
return name
.replace(/[\/\\:*?"<>|]/g, '') // Remove illegal chars
.replace(/\s+/g, '_') // Spaces → underscores
.replace(/_+/g, '_') // Collapse multiple _
.trim();
}
git switch -c bugfix/PIXELCRAFT-013-export-filename
git add src/scripts/
git commit -m "Fix export filename and add sanitizer (PIXELCRAFT-013)"
git push origin bugfix/PIXELCRAFT-013-export-filename
# PR → Review → Merge → Close ticket ✅
Strings as arrays of characters.
Internally, "hello" is stored as character codes: [104, 101, 108, 108, 111] in UTF-16 encoding.