Skip to content

Commit fdf1633

Browse files
authored
chg: refactored to load tabs in background script (#108)
1 parent 52dfc79 commit fdf1633

File tree

13 files changed

+242
-151
lines changed

13 files changed

+242
-151
lines changed

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44

55
- Changed
66
- Keyboard shortcut defaults for compatibility
7+
- Refactored load process to run in background script for reliability
78

89
- Fixed
910
- Error handling on tab creation

src/browseraction/__tests__/BrowserAction.spec.ts

Lines changed: 22 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,24 @@ import { NEW_TAB_GROUP_TITLE, NO_TAB_GROUP_TITLE } from '../components/logic/tab
66
import { NEW_CONTAINER_TITLE, NO_CONTAINER_TITLE } from '../components/logic/containers'
77

88
let mockStore: Record<string, string> = {}
9-
let tabCreateMockCallCount = 0
10-
let searchQueryMockCalls: any[] = []
9+
let sendMessageCalls: any[] = []
1110

1211
beforeEach(() => {
1312
mockStore = {}
14-
tabCreateMockCallCount = 0
15-
searchQueryMockCalls = []
13+
sendMessageCalls = []
1614

1715
vi.mock('webextension-polyfill', () => ({
1816
default: {
19-
tabs: {
20-
create: () => {
21-
tabCreateMockCallCount++
22-
return Promise.resolve({ id: 41 + tabCreateMockCallCount })
17+
runtime: {
18+
getURL: (val: string) => val,
19+
sendMessage: (message: any) => {
20+
sendMessageCalls.push(message)
21+
return Promise.resolve()
22+
},
23+
onMessage: {
24+
addListener: vi.fn()
2325
}
2426
},
25-
search: {
26-
query: (props: any) => searchQueryMockCalls.push(props)
27-
},
28-
runtime: { getURL: (val: string) => val },
2927
storage: {
3028
local: {
3129
get: (key: string | string[]) => {
@@ -71,51 +69,27 @@ describe('browser action', () => {
7169
expect((urlInput.element as HTMLInputElement).value).toBe('https://github.com\n')
7270
})
7371

74-
it('opens urls in new tabs', async () => {
72+
it('sends loadSites message to background script', async () => {
7573
const wrapper = mount(App)
7674
await flushPromises()
7775

7876
await wrapper
7977
.find('textarea#urls')
8078
.setValue('https://github.com\nhttps://github.com/htrinter/')
8179

82-
expect(tabCreateMockCallCount).toBe(0)
83-
84-
await wrapper.find('button#open').trigger('click')
85-
86-
expect(tabCreateMockCallCount).toBe(2)
87-
expect(searchQueryMockCalls).toHaveLength(0)
88-
})
89-
90-
it('does not handle non-urls as search queries', async () => {
91-
const wrapper = mount(App)
92-
await flushPromises()
93-
94-
await wrapper.find('textarea#urls').setValue('test')
95-
96-
await wrapper.find('button#open').trigger('click')
97-
98-
expect(tabCreateMockCallCount).toBe(1)
99-
expect(searchQueryMockCalls).toHaveLength(0)
100-
})
101-
102-
it('handles non-urls as search queries', async () => {
103-
mockStore = {
104-
[BrowserStorageKey.handleAsSearchQuery]: String(true)
105-
}
106-
107-
const wrapper = mount(App)
108-
await flushPromises()
109-
110-
await wrapper.find('textarea#urls').setValue('test')
111-
11280
await wrapper.find('button#open').trigger('click')
11381

114-
expect(tabCreateMockCallCount).toBe(1)
115-
expect(searchQueryMockCalls).toHaveLength(1)
116-
expect(searchQueryMockCalls[0]).toEqual({
117-
text: 'test',
118-
tabId: 42
82+
expect(sendMessageCalls).toHaveLength(1)
83+
expect(sendMessageCalls[0]).toEqual({
84+
action: 'loadSites',
85+
deduplicate: false,
86+
handleAsSearchQuery: false,
87+
lazyloading: false,
88+
random: false,
89+
reverse: false,
90+
selectedContainerId: 'NO_CONTAINER_ID',
91+
selectedTabGroupId: -1,
92+
text: 'https://github.com\nhttps://github.com/htrinter/'
11993
})
12094
})
12195

src/browseraction/__tests__/BrowserActionContainers.spec.ts

Lines changed: 36 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -11,39 +11,31 @@ import {
1111
import { NEW_TAB_GROUP_TITLE, NO_TAB_GROUP_TITLE } from '../components/logic/tabgroups'
1212

1313
const MOCK_CONTAINER_ID = '123'
14-
const MOCK_NEW_CONTAINER_ID = '123-new'
1514
const MOCK_CONTAINER_NAME = 'Mock Container'
1615

1716
let mockStore: Record<string, string> = {}
18-
let tabCreateMockCalls: any[] = []
19-
let searchQueryMockCalls: any[] = []
20-
let createContainerMockCalls: any[] = []
17+
let sendMessageCalls: any[] = []
2118
beforeEach(() => {
2219
mockStore = {}
23-
tabCreateMockCalls = []
24-
searchQueryMockCalls = []
25-
createContainerMockCalls = []
20+
sendMessageCalls = []
2621

2722
vi.mock('webextension-polyfill', () => ({
2823
default: {
29-
tabs: {
30-
create: (props: any) => {
31-
tabCreateMockCalls.push(props)
32-
return Promise.resolve({ id: 41 + tabCreateMockCalls.length })
33-
}
34-
},
3524
contextualIdentities: {
3625
query: () =>
37-
Promise.resolve([{ cookieStoreId: MOCK_CONTAINER_ID, name: MOCK_CONTAINER_NAME }]),
38-
create: (props: any) => {
39-
createContainerMockCalls.push(props)
40-
return Promise.resolve({ cookieStoreId: MOCK_NEW_CONTAINER_ID })
41-
}
26+
Promise.resolve([{ cookieStoreId: MOCK_CONTAINER_ID, name: MOCK_CONTAINER_NAME }])
4227
},
43-
search: {
44-
query: (props: any) => searchQueryMockCalls.push(props)
28+
29+
runtime: {
30+
getURL: (val: string) => val,
31+
sendMessage: (message: any) => {
32+
sendMessageCalls.push(message)
33+
return Promise.resolve()
34+
},
35+
onMessage: {
36+
addListener: vi.fn()
37+
}
4538
},
46-
runtime: { getURL: (val: string) => val },
4739
storage: {
4840
local: {
4941
get: (key: string | string[]) => {
@@ -89,17 +81,19 @@ describe('browser action', () => {
8981
.setValue('https://github.com\nhttps://github.com/htrinter/')
9082
await wrapper.find('select#containerSelection').setValue(NEW_CONTAINER_ID)
9183

92-
expect(tabCreateMockCalls.length).toBe(0)
93-
expect(createContainerMockCalls).toHaveLength(0)
94-
9584
await wrapper.find('button#open').trigger('click')
9685

97-
expect(tabCreateMockCalls.length).toBe(2)
98-
expect(createContainerMockCalls).toHaveLength(1)
99-
expect(tabCreateMockCalls[0]).toEqual({
100-
active: false,
101-
cookieStoreId: MOCK_NEW_CONTAINER_ID,
102-
url: 'https://github.com'
86+
expect(sendMessageCalls).toHaveLength(1)
87+
expect(sendMessageCalls[0]).toEqual({
88+
action: 'loadSites',
89+
deduplicate: false,
90+
handleAsSearchQuery: false,
91+
lazyloading: false,
92+
random: false,
93+
reverse: false,
94+
selectedContainerId: 'NEW_CONTAINER_ID',
95+
selectedTabGroupId: -1,
96+
text: 'https://github.com\nhttps://github.com/htrinter/'
10397
})
10498
})
10599

@@ -112,13 +106,20 @@ describe('browser action', () => {
112106
.setValue('https://github.com\nhttps://github.com/htrinter/')
113107
await wrapper.find('select#containerSelection').setValue(MOCK_CONTAINER_ID)
114108

115-
expect(tabCreateMockCalls.length).toBe(0)
116-
expect(createContainerMockCalls).toHaveLength(0)
117-
118109
await wrapper.find('button#open').trigger('click')
119110

120-
expect(tabCreateMockCalls.length).toBe(2)
121-
expect(createContainerMockCalls).toHaveLength(0)
111+
expect(sendMessageCalls).toHaveLength(1)
112+
expect(sendMessageCalls[0]).toEqual({
113+
action: 'loadSites',
114+
deduplicate: false,
115+
handleAsSearchQuery: false,
116+
lazyloading: false,
117+
random: false,
118+
reverse: false,
119+
selectedContainerId: '123',
120+
selectedTabGroupId: -1,
121+
text: 'https://github.com\nhttps://github.com/htrinter/'
122+
})
122123
})
123124
})
124125

src/browseraction/__tests__/BrowserActionTabGroups.spec.ts

Lines changed: 34 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -14,31 +14,27 @@ const MOCK_TAB_GROUP_ID = 123
1414
const MOCK_TAB_GROUP_TITLE = 'Mock Tab Group'
1515

1616
let mockStore: Record<string, string> = {}
17-
let tabCreateMockCallCount = 0
18-
let searchQueryMockCalls: any[] = []
19-
let tabGroupMockCalls: any[] = []
17+
let sendMessageCalls: any[] = []
18+
2019
beforeEach(() => {
2120
mockStore = {}
22-
tabCreateMockCallCount = 0
23-
searchQueryMockCalls = []
24-
tabGroupMockCalls = []
21+
sendMessageCalls = []
2522

2623
vi.mock('webextension-polyfill', () => ({
2724
default: {
28-
tabs: {
29-
create: () => {
30-
tabCreateMockCallCount++
31-
return Promise.resolve({ id: 41 + tabCreateMockCallCount })
32-
},
33-
group: (props: any) => tabGroupMockCalls.push(props)
34-
},
3525
tabGroups: {
3626
query: () => Promise.resolve([{ id: MOCK_TAB_GROUP_ID, title: MOCK_TAB_GROUP_TITLE }])
3727
},
38-
search: {
39-
query: (props: any) => searchQueryMockCalls.push(props)
28+
runtime: {
29+
getURL: (val: string) => val,
30+
sendMessage: (message: any) => {
31+
sendMessageCalls.push(message)
32+
return Promise.resolve()
33+
},
34+
onMessage: {
35+
addListener: vi.fn()
36+
}
4037
},
41-
runtime: { getURL: (val: string) => val },
4238
storage: {
4339
local: {
4440
get: (key: string | string[]) => {
@@ -84,16 +80,19 @@ describe('browser action', () => {
8480
.setValue('https://github.com\nhttps://github.com/htrinter/')
8581
await wrapper.find('select#tabGroupSelection').setValue(NEW_TAB_GROUP_ID)
8682

87-
expect(tabCreateMockCallCount).toBe(0)
88-
expect(tabGroupMockCalls).toHaveLength(0)
89-
9083
await wrapper.find('button#open').trigger('click')
9184

92-
expect(tabCreateMockCallCount).toBe(2)
93-
expect(tabGroupMockCalls).toHaveLength(1)
94-
expect(tabGroupMockCalls[0]).toEqual({
95-
tabIds: [42, 43],
96-
groupId: undefined
85+
expect(sendMessageCalls).toHaveLength(1)
86+
expect(sendMessageCalls[0]).toEqual({
87+
action: 'loadSites',
88+
deduplicate: false,
89+
handleAsSearchQuery: false,
90+
lazyloading: false,
91+
random: false,
92+
reverse: false,
93+
selectedContainerId: 'NO_CONTAINER_ID',
94+
selectedTabGroupId: -2,
95+
text: 'https://github.com\nhttps://github.com/htrinter/'
9796
})
9897
})
9998

@@ -106,16 +105,19 @@ describe('browser action', () => {
106105
.setValue('https://github.com\nhttps://github.com/htrinter/')
107106
await wrapper.find('select#tabGroupSelection').setValue(MOCK_TAB_GROUP_ID)
108107

109-
expect(tabCreateMockCallCount).toBe(0)
110-
expect(tabGroupMockCalls).toHaveLength(0)
111-
112108
await wrapper.find('button#open').trigger('click')
113109

114-
expect(tabCreateMockCallCount).toBe(2)
115-
expect(tabGroupMockCalls).toHaveLength(1)
116-
expect(tabGroupMockCalls[0]).toEqual({
117-
tabIds: [42, 43],
118-
groupId: MOCK_TAB_GROUP_ID
110+
expect(sendMessageCalls).toHaveLength(1)
111+
expect(sendMessageCalls[0]).toEqual({
112+
action: 'loadSites',
113+
deduplicate: false,
114+
handleAsSearchQuery: false,
115+
lazyloading: false,
116+
random: false,
117+
reverse: false,
118+
selectedContainerId: 'NO_CONTAINER_ID',
119+
selectedTabGroupId: 123,
120+
text: 'https://github.com\nhttps://github.com/htrinter/'
119121
})
120122
})
121123
})

src/browseraction/__tests__/logic/load.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import browser from 'webextension-polyfill'
22
import { afterEach, describe, expect, it, vi } from 'vitest'
3-
import { getTabCount, splitInputLines, loadSites } from '@/browseraction/components/logic/load'
43
import { NEW_TAB_GROUP_ID, NO_TAB_GROUP_ID } from '@/browseraction/components/logic/tabgroups'
54
import { NEW_CONTAINER_ID, NO_CONTAINER_ID } from '@/browseraction/components/logic/containers'
5+
import { getTabCount, loadSites, splitInputLines } from '@/browseraction/components/logic/load'
66

77
const MOCK_TAB_GROUP_ID = 42
88
const MOCK_CONTAINER_ID = '123-container'

src/browseraction/components/ActionBar.vue

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,13 @@
4040
</template>
4141

4242
<script lang="ts">
43-
import { getTabCount, loadSites } from '@/browseraction/components/logic/load'
4443
import { extractURLs } from '@/browseraction/components/logic/extract'
4544
import { store } from '@/browseraction/components/store/store'
4645
import { loadTabGroups } from './logic/tabgroups'
4746
import { loadContainers } from './logic/containers'
47+
import browser from 'webextension-polyfill'
48+
import type { LoadSitesMessage } from '@/serviceworker/types'
49+
import { getTabCount } from './logic/load'
4850
4951
export default {
5052
data() {
@@ -55,16 +57,18 @@ export default {
5557
},
5658
methods: {
5759
openURLs() {
58-
loadSites(
59-
store.urlList,
60-
store.lazyLoadingChecked,
61-
store.loadInRandomOrderChecked,
62-
store.loadInReverseOrderChecked,
63-
store.deduplicateURLsChecked,
64-
store.handleAsSearchQueryChecked,
65-
this.selectedTabGroupId,
66-
this.selectedContainerId
67-
).then(() => {
60+
const message: LoadSitesMessage = {
61+
action: 'loadSites',
62+
text: store.urlList,
63+
lazyloading: store.lazyLoadingChecked,
64+
random: store.loadInRandomOrderChecked,
65+
reverse: store.loadInReverseOrderChecked,
66+
deduplicate: store.deduplicateURLsChecked,
67+
handleAsSearchQuery: store.handleAsSearchQueryChecked,
68+
selectedTabGroupId: this.selectedTabGroupId,
69+
selectedContainerId: this.selectedContainerId
70+
}
71+
browser.runtime.sendMessage(message).then(() => {
6872
loadTabGroups().then((tabGroups) => {
6973
store.tabGroups = tabGroups
7074
})

0 commit comments

Comments
 (0)