Optimize bulk deletion flow and handle UI residuals

- Check for existing delete button before initiating deletion.
- Remove lingering delete button from DOM if present.
- Ensure sequential deletion of selected conversations.
This commit is contained in:
qcrao
2023-10-19 17:21:59 +08:00
parent 42fc405595
commit b760a1837b
2 changed files with 40 additions and 38 deletions

View File

@@ -1,84 +1,86 @@
const Selectors = {
conversationsCheckbox: '.conversation-checkbox:checked',
deleteButton: 'nav div a>div>button:nth-child(2)',
confirmDeleteButton: 'button.btn.btn-danger',
};
async function bulkDeleteConversations() {
const selectedConversations = getSelectedConversations();
if (selectedConversations.length === 0) {
console.log("No conversations to delete.");
removeAllCheckboxes();
return;
console.log("No conversations to delete.");
removeAllCheckboxes();
return;
}
let deleteButton = document.querySelector(Selectors.deleteButton);
if (deleteButton) {
deleteButton.remove();
}
console.log("Selected Conversations:", selectedConversations);
// 使用 for 循环按顺序删除选中的对话
for (const element of selectedConversations) {
await deleteConversation(element);
await delay(300);
}
}
function getSelectedConversations() {
return [...document.querySelectorAll('.conversation-checkbox:checked')];
return [...document.querySelectorAll(Selectors.conversationsCheckbox)];
}
function removeAllCheckboxes() {
const allCheckboxes = document.querySelectorAll('.conversation-checkbox');
const allCheckboxes = document.querySelectorAll(Selectors.conversationsCheckbox);
allCheckboxes.forEach(checkbox => checkbox.remove());
}
async function deleteConversation(checkbox) {
const conversationElement = await checkbox.closest('.flex.p-3.items-center.gap-3.relative.rounded-md')
const conversationElement = await checkbox.closest('.flex.p-3.items-center.gap-3.relative.rounded-md');
console.log("1. 点击对话", conversationElement);
conversationElement.click(); // 点击对话
console.log("1. Clicking conversation", conversationElement);
conversationElement.click();
// debugger
const deleteButton = await waitForElement("nav div a>div>button:nth-child(2)");
const deleteButton = await waitForElement(Selectors.deleteButton);
if (deleteButton) {
console.log("2. 点击删除按钮");
console.log("2. Clicking delete button", deleteButton);
deleteButton.click(); // 点击删除按钮
await delay(300);
deleteButton.click();
const confirmButton = await waitForElement(Selectors.confirmDeleteButton);
// 等待确认删除对话框的按钮出现
const confirmButton = await waitForElement('button.btn.btn-danger');
if (confirmButton) {
console.log("3. Clicking confirm button");
confirmButton.click();
if (confirmButton) {
console.log("3. 点击确认按钮");
confirmButton.click();
// 等待删除按钮消失
await waitForElementToDisappear('button.btn.btn-danger');
}
await waitForElementToDisappear(Selectors.confirmDeleteButton);
}
}
console.log("4. 完成删除");
console.log("4. Deletion completed");
}
// 用于等待某元素出现的函数
async function waitForElement(selector, timeout = 5000) {
async function waitForElement(selector, timeout = 2000) {
const startedAt = Date.now();
while ((Date.now() - startedAt) < timeout) {
const element = document.querySelector(selector);
if (element) return element;
await delay(100);
const element = document.querySelector(selector);
if (element) return element;
await delay(100);
}
console.log('do not found delete confirm button')
console.log(`Element ${selector} not found within ${timeout}ms`);
throw new Error(`Element ${selector} not found within ${timeout}ms`);
}
// 用于等待某元素消失的函数
async function waitForElementToDisappear(selector, timeout = 5000) {
async function waitForElementToDisappear(selector, timeout = 2000) {
const startedAt = Date.now();
while ((Date.now() - startedAt) < timeout) {
const element = document.querySelector(selector);
if (!element) return;
await delay(100);
const element = document.querySelector(selector);
if (!element) return;
await delay(100);
}
throw new Error(`Element ${selector} did not disappear within ${timeout}ms`);
}
// 延迟函数
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}

View File

@@ -1,7 +1,7 @@
{
"manifest_version": 3,
"name": "ChatGPT Bulk Delete",
"version": "2.8",
"version": "2.9",
"description": "A Chrome extension to bulk delete ChatGPT conversations",
"icons": {
"48": "icon48.png"