export-download-debugging
Ajuda a resolver problemas com downloads e exportações de arquivos, especialmente imagens. É útil quando os arquivos não são salvos corretamente ou ficam corrompidos.
O que ela faz
Esta ferramenta ajuda a descobrir por que um arquivo que você tentou baixar ou exportar não funcionou. Ela verifica se o arquivo foi criado corretamente antes de tentar salvá-lo, especialmente para imagens.
Quando usar
- ✓Quando um download ou exportação parece funcionar, mas o arquivo fica vazio.
- ✓Se um arquivo de imagem baixado não abre ou está corrompido.
- ✓Ao ter problemas com a função 'Salvar como' no navegador ou em aplicativos.
Exemplo do que pedir para a IA
“Minha imagem exportada está vindo como um arquivo de 0 KB, pode me ajudar a consertar?”
Quer saber mais? Abra as seções abaixo.
Como usar
O jeito mais fácil: copie a mensagem abaixo e cole no Claude, ChatGPT, Cursor ou outra IA. Ela lê a skill e segue as instruções.
Link da skill
Mensagem pronta para colar
Como funciona
Ela primeiro verifica se os dados do arquivo foram gerados corretamente. Se sim, ela tenta usar um método mais simples e confiável para salvar o arquivo, evitando problemas comuns que criam arquivos vazios.
Instalação
Jeito mais fácil: copie o link da skill e cole no Claude, ChatGPT ou Cursor pedindo para seguir as instruções.
No terminal (Claude Code, Codex, Cursor), na pasta do projeto:
npx skills add nexu-io/open-design --skill export-download-debuggingOu baixe só o arquivo:
curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/skills/export-download-debugging/SKILL.md -o SKILL.mdConteúdo técnico (SKILL.md)
Tradução do texto original do autor no GitHub. Os comandos e códigos estão como no original.
Depuração de Download de Exportação
Use isso quando uma exportação ou download parecer funcionar, mas produzir um arquivo vazio, ausente ou inutilizável. Ele é otimizado para pré-visualizações de navegador, captura de iframe e shells do Electron.
Regra principal
Separe a captura do salvamento. Prove que a carga útil da exportação tem bytes não nulos antes de depurar o caminho de destino. Um arquivo de 0 KB geralmente significa que o seletor nativo ou o host criou o arquivo de destino, e a gravação falhou ou foi bloqueada.
Evidências
- Registre o tipo de carga útil, tipo MIME, comprimento em bytes, URL do objeto ou caminho da URL de dados e o nome/mensagem do erro lançado.
- Verifique a saída do console do navegador e os logs do aplicativo em torno de
showSaveFilePicker,createWritable,<a download>,URL.createObjectURLe revogação de URL. - No Electron, inspecione o caminho
will-download: nome do arquivo, MIME, extensão do arquivo, filtros de diálogo de salvamento, cancelamento e tamanho final do arquivo. - Confirme o tamanho real do arquivo baixado no disco e se ele abre em um visualizador de imagens normal.
Ordem de correção
- Prepare e valide a carga útil da exportação primeiro; desabilite Salvar até que os bytes estejam disponíveis.
- Prefira o canal de salvamento estável mais simples para o host. Se
showSaveFilePicker().createWritable()falhar, estiver em sandbox ou criar arquivos vazios, direcione para<a download>ou o gerenciador de downloads do Electron em vez disso. - Evite abrir um seletor nativo antes que a carga útil esteja pronta. Isso impede que o host crie um arquivo de destino vazio em caso de falha posterior na gravação.
- Para fallback de PNG, prefira uma URL de dados verificada e não vazia quando URLs de blob, tempo de revogação, CSP ou sandboxing de iframe forem suspeitos.
- No Electron, adicione filtros explícitos de Salvar como para extensões de imagem exportadas (
.png,.jpg,.jpeg,.webp) para que os usuários possam escolher um destino de imagem real. - Mantenha a interface do usuário restrita: seleção de formato, dica de nome/caminho do arquivo, estados claros de pendência e erro, e uma ação de salvamento principal.
Validação
- Adicione ou atualize testes para preparação de carga útil não vazia, comportamento de salvamento de fallback, mapeamento de extensão de arquivo/MIME e estados de UI desabilitados/erro.
- Execute testes de exportação focados, depois
pnpm --filter @open-design/web typecheck. - Se o tratamento de download do Electron mudou, execute também
pnpm --filter @open-design/desktop typecheck. - Antes de enviar, execute
pnpm guard, inspecione a diferença preparada para arquivos não relacionados, artefatos gerados e segredos acidentais, e use o fluxo de trabalho de portão de qualidade de PR do repositório se a correção estiver sendo preparada para revisão.
Perguntas frequentes
Por que o arquivo fica vazio?
Isso geralmente acontece porque o sistema criou o arquivo no seu computador, mas a escrita dos dados falhou ou foi bloqueada antes de terminar.
O que é 'payload'?
Payload é a informação ou os dados que você está tentando exportar ou baixar, como os pixels de uma imagem ou o conteúdo de um documento.
O que são 'Blob/Data URLs'?
São maneiras de representar dados (como imagens) diretamente no navegador, sem precisar de um arquivo separado. A ferramenta verifica se eles estão funcionando corretamente.
Detalhes
Descrição original do autor
Diagnose and fix browser, preview, or Electron export/download failures, especially image export issues involving Save As, Blob/Data URLs, the File System Access API, createWritable failures, and 0 KB files.
repo: nexu-io/open-design
Popularidade
- Estrelas no GitHub
- 101 mil
- Posição no ranking
- #690
- Licença
- Apache-2.0
- Atualizada em
- 16/10/2026
Comentários
- …
Mais skills deste repositório
sample-plugin
Faz seu agente criar um arquivo de metadados para testes. Ele ajuda a garantir que o código funcione corretamente em diferentes situações.
nexu-io/open-design
aster-atelier
Ajuda seu agente a criar um site artístico com visual clássico. Ele usa imagens elegantes, céus azuis e fontes serifadas para um visual cinematográfico.
nexu-io/open-design
audio-jingle
Faz seu agente gerar áudio como jingles e efeitos sonoros. Ele pode criar músicas e vozes, salvando o resultado em um arquivo de áudio.
nexu-io/open-design
blog-post
Ajuda seu agente a escrever artigos longos ou posts de blog. Ele inclui espaços para imagens, citações e informações do autor.
nexu-io/open-design
Skills parecidas
cpp-testing
Faz seu agente escrever e melhorar testes para código C++. Ajuda a configurar ferramentas de teste e a corrigir erros.
affaan-m/ECC
csharp-testing
Ajuda seu agente a criar testes para código C# e .NET. Ele usa as melhores práticas para garantir que os testes sejam eficientes e confiáveis.
affaan-m/ECC
django-tdd
Faz seu agente aplicar estratégias de teste para Django com pytest-django e TDD. É útil para escrever testes robustos e garantir a qualidade do código, especialmente para APIs DRF.
affaan-m/ECC