Este guia mostra como usar o Chrome DevTools para inspecionar dados do Web SQL.
Ver dados do Web SQL
Clique na guia Origens para abrir o painel Aplicativo. Expanda a seção Web SQL para ver bancos de dados e tabelas. Na Figura 1 abaixo, html5meetup é um banco de dados e rooms é uma tabela.
Figura 1. O painel Web SQL.
Clique em uma tabela para visualizar os dados dela.
Figura 2. Visualização dos dados da tabela rooms do Web SQL.
Editar dados do Web SQL
Não é possível editar dados do Web SQL ao visualizar uma tabela, como na Figura 2 acima. No entanto, é possível executar instruções do console Web SQL que editam ou excluem tabelas. Confira Executar consultas do Web SQL.
Executar consultas SQL na Web
- Clique em um banco de dados para abrir um console para ele.
Digite uma instrução SQL da Web e pressione Enter para executá-la.
Figura 3. Usando o Web SQL Console para excluir uma linha da tabela rooms.
Atualizar uma tabela Web SQL
O DevTools não atualiza tabelas em tempo real. Para atualizar os dados em uma tabela:
- Veja os dados de uma tabela do Web SQL
- Clique em Atualizar
.
Filtrar colunas em uma tabela do Web SQL
- Veja os dados de uma tabela do Web SQL
Use a caixa de texto Colunas visíveis para especificar quais colunas você quer mostrar. Forneça os nomes das colunas como uma lista CSV.
Figura 4. Use a caixa de texto Colunas visíveis para mostrar apenas as colunas
room_nameelast_updated.
Excluir todos os dados do Web SQL
- Abra o painel Limpar armazenamento.
Verifique se a caixa de seleção Web SQL está marcada.
Figura 5. A caixa de seleção Web SQL.
Clique em Limpar dados do site.
Figura 6. O botão Limpar dados do site.