Atualizando Registros com o IndexedDB em JavaScript

O método put() da interface IDBObjectStore é utilizado para atualizar um registro existente no banco de dados ou inserir um novo registro caso ele ainda não exista.

put(item);
put(item, key);

O primeiro parâmetro, item, representa o valor a ser atualizado ou adicionado no banco de dados. O segundo parâmetro, opcional, key, indica a chave pela qual o registro será atualizado ou adicionado.

O método put() retorna um objeto do tipo IDBRequest. Em caso de sucesso na atualização ou adição, o evento success é disparado no objeto IDBRequest, e a propriedade result conterá o registro associado à chave especificada. Em caso de erro, o evento error será disparado, acompanhado por uma exceção do tipo DOMException. Para tratar esses eventos, podem ser utilizados os manipuladores onsuccess e onerror, respectivamente.

Considere um armazenamento chamado users no banco de dados test, contendo os seguintes registros:

[
  { name: "Tom", age: 39, id: 1 },
  { name: "Bob", age: 43, id: 2 },
  { name: "Sam", age: 28, id: 3 },
];

A seguir, veremos como atualizar o registro com a chave 1 no armazenamento users:

const request = indexedDB.open("test", 5); // Conecta ao banco de dados 'test'

// Criação ou atualização da estrutura do banco de dados
request.onupgradeneeded = (event) => {
  const db = event.target.result; // Obtém a instância do banco de dados
  // Cria o armazenamento 'users' com chave primária 'id' e autoincremento
  db.createObjectStore("users", { keyPath: "id", autoIncrement: true });
};

// Operações após o banco de dados ser aberto com sucesso
request.onsuccess = (event) => {
  const db = event.target.result; // Obtém a instância do banco de dados
  const transaction = db.transaction(["users"], "readwrite"); // Cria uma transação de leitura e escrita
  const userStore = transaction.objectStore("users"); // Obtém o armazenamento 'users'

  // Busca o registro com id = 1
  const getRequest = userStore.get(1);

  getRequest.onsuccess = () => {
    const user = getRequest.result;
    console.log(user); // Exibe o registro original no console

    // Modifica as propriedades do registro
    user.name = "Tomas";
    user.age = 22;

    // Atualiza o registro no armazenamento
    const updateRequest = userStore.put(user);

    updateRequest.onsuccess = () => console.log("Registro atualizado com sucesso");
    updateRequest.onerror = (e) => console.log(`Erro ao atualizar: ${e.target.error.message}`);
  };

  getRequest.onerror = (e) => console.log(`Erro ao buscar registro: ${e.target.error.message}`);
};

Documentação oficial:

Indexed Database API - W3C