Skip to content

Commit

Permalink
TAB-552 (pw)
Browse files Browse the repository at this point in the history
  • Loading branch information
evandor committed Nov 26, 2024
1 parent b93d9db commit d149d34
Show file tree
Hide file tree
Showing 9 changed files with 137 additions and 89 deletions.
35 changes: 25 additions & 10 deletions e2e/addFirstTabset.spec.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import {test} from './fixtures';
import {Frame, Page} from "@playwright/test";
import {test, expect} from './fixtures';
import {Page} from "@playwright/test";

function urlFor(extensionId: string, path: string) {
return `chrome-extension://${extensionId}/www/index.html#${path}`
Expand Down Expand Up @@ -36,22 +36,37 @@ test('first tabset', async ({page, extensionId, context}) => {
const newTabsetName = sidePanelPage.locator('[data-testid=newTabsetName]')
await newTabsetName.fill("tabsetName")

// await sidePanelPage.getByText("ADD TABSET").click()
// await sidePanelPage.getByText("ADD TABSET").click()

const addTabsetSubmitBtn = sidePanelPage.locator('[data-testid=addTabsetSubmitBtn]')
await addTabsetSubmitBtn.click()

const tabsetId = await page.evaluate(() => localStorage.getItem('test.tabsetId'))
console.log("tabsetId", tabsetId)

// await page.goto(urlFor(extensionId, '/sidepanel'));
// await page.waitForURL('**\/sidepanel')
//
// const newTab = await context.newPage();
// await newTab.goto("https://www.skysail.io");
//
// const saveInTabsetBtn = page.locator('[data-testid=saveInTabsetBtn]')
//
const newTab = await context.newPage();
await newTab.goto("https://www.skysail.io");

const saveInTabsetBtn = sidePanelPage.locator('[data-testid=saveInTabsetBtn]')
// // await page.screenshot({ path: 'saveInTabsetBtn.png', fullPage: true });
//
// await saveInTabsetBtn.click()
await saveInTabsetBtn.click()
const tabId = await page.evaluate(() => localStorage.getItem('test.tabId'))
console.log("tabId", tabId)

const skysailTabDetails = await context.newPage();
await skysailTabDetails.goto(urlFor(extensionId, `/mainpanel/tab/${tabId}`));

await skysailTabDetails.locator('#contentTab').click()
// await skysailTabDetails.locator('#debugTab').click()

expect(skysailTabDetails.locator('[data-testid=content]')).toContainText('this website uses cookies ensure best experience')


// await skysailTabDetails.locator('#debugTabA').click()

// await page.waitForURL('**\/sidepanel')
//
// const addTabsetBtn = page.locator('[data-testid=addTabsetBtn]')
Expand Down
4 changes: 2 additions & 2 deletions e2e/fixtures.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ export const test = base.extend<{
await context.close();
},
extensionId: async ({ context }, use) => {
console.log("context", context)
console.log("use", use)
// console.log("context", context)
// console.log("use", use)
/*
// for manifest v2:
let [background] = context.backgroundPages()
Expand Down
58 changes: 58 additions & 0 deletions e2e/utils/indexedDb.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
export function useIndexedDb() {


let db:any
let dbNamespace:any

function setupDB(namespace: string) {
console.log("======")
return new Promise<any>(function (resolve, reject) {
if (namespace != dbNamespace) {
db = null;
}
dbNamespace = namespace;

// If setupDB has already been run and the database was set up, no need to
// open the database again; just resolve and return!
if (db) {
resolve(db);
return;
}

let dbName = namespace == '' ? 'myDatabase' : 'myDatabase_' + namespace;
let dbReq = indexedDB.open(dbName, 2);

// Fires when the version of the database goes up, or the database is
// created for the first time
dbReq.onupgradeneeded = function (event:any) {
db = event.target!.result;

// Create an object store named notes, or retrieve it if it already
// exists. Object stores in databases are where data are stored.
let notes;
if (!db.objectStoreNames.contains('notes')) {
notes = db.createObjectStore('notes', {autoIncrement: true});
} else {
notes = dbReq.transaction!.objectStore('notes');
}
}

// Fires once the database is opened (and onupgradeneeded completes, if
// onupgradeneeded was called)
dbReq.onsuccess = function (event:any) {
// Set the db variable to our database so we can use it!
db = event.target!.result;
resolve(db);
}

// Fires when we can't open the database
dbReq.onerror = function (event:any) {
reject(`error opening database ${event.target!.errorCode}`);
}
});
}

return {
setupDB
}
}
2 changes: 1 addition & 1 deletion src/pages/BrowserViewPage.vue
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ watchEffect(async () => {
})
const openInNewTab = () => console.log("not implemented")
const openInNewTab = () => console.log("not implemented A")
const iFrameStyle = () => {
const v = "overflow:hidden;height:" + (window.innerHeight - 80) + "px;width:100%;border:0px"
Expand Down
2 changes: 1 addition & 1 deletion src/pages/PreviewPage.vue
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,6 @@ watchEffect(async () => {
})
const openInNewTab = () => console.log("not implemented")
const openInNewTab = () => console.log("not implemented B")
</script>
88 changes: 44 additions & 44 deletions src/pages/TabPage.vue
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,14 @@
<q-tabs align="left"
v-model="tab"
no-caps>
<q-tab name="tabdata" label="Tab Details"/>
<q-tab name="tabdata" label="Tab Details" id="tabdataTab"/>
<q-tab name="meta" :label="metaDataLabel()"/>
<q-tab name="request" :label="requestDataLabel()"/>
<q-tab name="metalinks" :label="metaLinksDataLabel()"/>
<q-tab name="links" :label="linksDataLabel()"/>
<q-tab name="history" label="History"/>
<q-tab name="content" label="Content"/>
<q-tab name="debug" label="Debug"/>
<q-tab name="content" label="Content" id="contentTab"/>
<q-tab name="debug" label="Debug" id="debugTab"/>
</q-tabs>
</div>

Expand All @@ -47,7 +47,7 @@
</q-img>
</div>
<div class="col-10 text-body1 ellipsis">
{{ getHost(selectedTab!.url || '', true) }}
{{ getHost(selectedTab?.url || '', true) }}
</div>
<div class="col-12 text-body2 ellipsis">
{{ selectedTab?.title }}
Expand All @@ -56,7 +56,7 @@
<div class="col-12">
<div class="text-overline ellipsis">
{{ selectedTab?.url }}&nbsp;<q-icon name="launch" color="secondary"
@click.stop="NavigationService.openOrCreateTab([tab.url] )"></q-icon>
@click.stop="NavigationService.openOrCreateTab([tab?.url || ''] )"></q-icon>
</div>
</div>
</div>
Expand Down Expand Up @@ -299,7 +299,7 @@
<q-td :props="props">
<div class="cursor-pointer text-blue-10">
<span v-if="props.row.href.length > 0 && props.row.href.startsWith('/')"
@click="openLink(selectedTab.url + '/' + props.row.href.substring(1))">
@click="openLink(selectedTab?.url + '/' + props.row.href.substring(1))">
{{ props.row.href }}
</span>
<span v-else @click="openLink(props.row.href)">{{ props.row.href }}</span>
Expand Down Expand Up @@ -360,7 +360,7 @@
<div class="col-5">
Content
</div>
<div class="col-7">
<div class="col-7" data-testid="content">
{{ content }}
</div>
</div>
Expand Down Expand Up @@ -439,10 +439,10 @@ watchEffect(() => {
tags.value = tabInfo.tab['tags' as keyof object]
selectedTab.value = tabInfo.tab
try {
const url = new URL(selectedTab.value.url || '')
const url = new URL(selectedTab.value?.url || '')
domain.value = url.protocol + url.host
} catch (err) {
domain.value = selectedTab.value.url
domain.value = selectedTab.value?.url
}
} else {
console.log("not found yet...")
Expand Down Expand Up @@ -500,12 +500,12 @@ const linkRows = ref<object[]>([])
watchEffect(async () => {
if (selectedTab.value) {
TabsetService.getThumbnailFor(selectedTab.value)
.then(data => {
if (data) {
thumbnail.value = data.thumbnail
}
})
// TabsetService.getThumbnailFor(selectedTab.value)
// .then(data => {
// if (data) {
// thumbnail.value = data.thumbnail
// }
// })
TabsetService.getContentFor(selectedTab.value)
.then(data => {
if (data) {
Expand All @@ -523,34 +523,34 @@ watchEffect(async () => {
}
}
})
TabsetService.getRequestFor(selectedTab.value)
.then(data => {
if (data) {
//console.log("got data", data)
request.value = data.requestInfo
_.forEach(data.requestInfo['headers'], h => {
requestRows.value.push({
name: h.name,
value: h.value
})
})
}
})
TabsetService.getMetaLinksFor(selectedTab.value)
.then(data => {
if (data) {
metaLinkRows.value = data.metaLinks
}
})
TabsetService.getLinksFor(selectedTab.value)
.then(data => {
if (data) {
linkRows.value = data.links
}
})
// TabsetService.getRequestFor(selectedTab.value)
// .then(data => {
// if (data) {
// //console.log("got data", data)
// request.value = data.requestInfo
//
// _.forEach(data.requestInfo['headers'], h => {
// requestRows.value.push({
// name: h.name,
// value: h.value
// })
// })
// }
// })
// TabsetService.getMetaLinksFor(selectedTab.value)
// .then(data => {
// if (data) {
// metaLinkRows.value = data.metaLinks
// }
// })
//
// TabsetService.getLinksFor(selectedTab.value)
// .then(data => {
// if (data) {
// linkRows.value = data.links
// }
// })
} else {
//router.push("/tabset")
Expand All @@ -577,7 +577,7 @@ watchEffect(() => {
keys.value = fuseIndex['keys' as keyof object] || {}
keysMap.value = fuseIndex['_keysMap' as keyof object]
const res = _.filter(fuseIndex['records' as keyof object], (r: any) => {
return selectedTab?.url === r.$[2]?.v
return r.$[2]?.v === selectedTab.value?.url
})
if (res && res.length > 0) {
index.value = res[0]
Expand Down
33 changes: 4 additions & 29 deletions src/services/IndexedDbPersistenceService.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,45 +20,20 @@ class IndexedDbPersistenceService implements PersistenceService {
useUiStore().dbReady = true
}

// saveRequest(url: string, requestInfo: RequestInfo): Promise<void> {
// return Promise.reject("not implemented")
// }
//
// saveMetaLinks(url: string, metaLinks: MetaLink[]): Promise<void | IDBValidKey> {
// return Promise.reject("not implemented")
// }
//
// saveLinks(url: string, links: any): Promise<void | IDBValidKey> {
// return Promise.reject("not implemented")
//
// }

// getRequest(url: string): Promise<string> {
// return Promise.reject("not implemented")
// }
//
// getMetaLinks(url: string): Promise<object> {
// return Promise.reject("not implemented")
// }
//
// getLinks(url: string): Promise<object> {
// return Promise.reject("not implemented")
// }

async cleanUpRequests(): Promise<void> {
return Promise.reject("not implemented")
return Promise.reject("not implemented C")
}

async cleanUpMetaLinks(): Promise<void> {
return Promise.reject("not implemented")
return Promise.reject("not implemented D")
}

async cleanUpLinks(): Promise<void> {
return Promise.reject("not implemented")
return Promise.reject("not implemented E")
}

async cleanUpExpired(tableName: string): Promise<void> {
return Promise.reject("not implemented")
return Promise.reject("not implemented F")
}

/** messages **/
Expand Down
2 changes: 1 addition & 1 deletion src/snapshots

0 comments on commit d149d34

Please sign in to comment.