Compartilhando um caso de depuração: resolvendo um problema de Suspense infinito causado pelo uso incorreto de IndexedDB

Há algumas semanas, começamos a usar bastante o IndexedDB no frontend do produto da empresa. Desde então, compartilho uma experiência de depuração de um problema que encontramos e que não foi fácil de resolver.

Resumo em 3 linhas

1. Preservar o estado do ambiente é extremamente importante na depuração. Se você tiver um ambiente em que o problema pode ser reproduzido, não mexa nele.
2. Ao usar IndexedDB, se a implementação foi feita de modo que a conexão só seja fechada ao encerrar a sessão, é obrigatório fechar a conexão também nos handlers dos eventos blocked e versionchange.
3. (Com base no React 18 ou superior) além de chamar APIs, se você estiver escrevendo código que também pode causar estado de suspensão, tome cuidado para não cair em um Suspense infinito. Além do tratamento do item 2, nós alteramos a implementação para lançar um erro se o mesmo fallback de Suspense continuar sendo renderizado por mais de 10 segundos, independentemente do motivo.