Skip to content
This repository was archived by the owner on Dec 11, 2019. It is now read-only.

Commit 9c10fa7

Browse files
bscliftonbsclifton
authored
Merge pull request #9694 from cezaraugusto/pref/7398
test and split TabsTab component
2 parents bd36f33 + d31b378 commit 9c10fa7

File tree

4 files changed

+354
-39
lines changed

4 files changed

+354
-39
lines changed

‎app/renderer/components/preferences/tabsTab.js

+128
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
/* This Source Code Form is subject to the terms of the Mozilla Public
2+
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
3+
* You can obtain one at http://mozilla.org/MPL/2.0/. */
4+
5+
const React = require('react')
6+
const ImmutableComponent = require('../immutableComponent')
7+
8+
const {DefaultSectionTitle} = require('../common/sectionTitle')
9+
const {SettingsList, SettingItem, SettingCheckbox} = require('../common/settings')
10+
11+
const {SettingDropdown} = require('../common/dropdown')
12+
13+
const {tabCloseAction} = require('../../../common/constants/settingsEnums')
14+
const {changeSetting} = require('../../lib/settingsUtil')
15+
const getSetting = require('../../../../js/settings').getSetting
16+
const settings = require('../../../../js/constants/settings')
17+
18+
class TabsTab extends ImmutableComponent {
19+
get tabsPerTabPageOption () {
20+
return [6, 8, 10, 20, 100]
21+
}
22+
23+
get tabCloseActionOptions () {
24+
return [
25+
{
26+
id: 'tabCloseActionLastActive',
27+
action: tabCloseAction.LAST_ACTIVE
28+
},
29+
{
30+
id: 'tabCloseActionNext',
31+
action: tabCloseAction.NEXT
32+
},
33+
{
34+
id: 'tabCloseActionParent',
35+
action: tabCloseAction.PARENT
36+
}
37+
]
38+
}
39+
render () {
40+
return (
41+
<div>
42+
<DefaultSectionTitle data-l10n-id='tabSettings' />
43+
<SettingsList>
44+
<SettingItem dataL10nId='tabsPerTabPage'>
45+
<SettingDropdown
46+
data-test-id='tabsPerTabPage'
47+
value={getSetting(settings.TABS_PER_PAGE, this.props.settings)}
48+
data-type='number'
49+
onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TABS_PER_PAGE)}>
50+
{// Sorry, Brad says he hates primes :'(
51+
this.tabsPerTabPageOption.map(option =>
52+
<option
53+
data-test-id='tabsPerTabPageOption'
54+
data-test-active={
55+
getSetting(settings.TABS_PER_PAGE, this.props.settings) === option
56+
}
57+
value={option}
58+
key={option}>
59+
{option}
60+
</option>
61+
)}
62+
</SettingDropdown>
63+
</SettingItem>
64+
<SettingItem dataL10nId='tabCloseAction'>
65+
<SettingDropdown
66+
value={getSetting(settings.TAB_CLOSE_ACTION, this.props.settings)}
67+
onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TAB_CLOSE_ACTION)}>
68+
{this.tabCloseActionOptions.map(option =>
69+
<option
70+
data-l10n-id={option.id}
71+
data-test-id='tabCloseActionActiveOption'
72+
data-test-active={
73+
getSetting(settings.TAB_CLOSE_ACTION, this.props.settings) === option.action
74+
}
75+
value={option.action}
76+
/>
77+
)}
78+
</SettingDropdown>
79+
</SettingItem>
80+
<SettingCheckbox
81+
dataL10nId='switchToNewTabs'
82+
dataTestId='switchToNewTabs'
83+
testIsEnabled={
84+
getSetting(settings.SWITCH_TO_NEW_TABS, this.props.settings) === true
85+
}
86+
prefKey={settings.SWITCH_TO_NEW_TABS}
87+
settings={this.props.settings}
88+
onChangeSetting={this.props.onChangeSetting}
89+
/>
90+
<SettingCheckbox
91+
dataL10nId='paintTabs'
92+
dataTestId='paintTabs'
93+
testIsEnabled={
94+
getSetting(settings.PAINT_TABS, this.props.settings) === true
95+
}
96+
prefKey={settings.PAINT_TABS}
97+
settings={this.props.settings}
98+
onChangeSetting={this.props.onChangeSetting}
99+
/>
100+
<SettingCheckbox
101+
dataL10nId='showTabPreviews'
102+
dataTestId='showTabPreviews'
103+
testIsEnabled={
104+
getSetting(settings.SHOW_TAB_PREVIEWS, this.props.settings) === true
105+
}
106+
prefKey={settings.SHOW_TAB_PREVIEWS}
107+
settings={this.props.settings}
108+
onChangeSetting={this.props.onChangeSetting}
109+
/>
110+
<SettingItem dataL10nId='dashboardSettingsTitle'>
111+
<SettingCheckbox
112+
dataL10nId='dashboardShowImages'
113+
dataTestId='dashboardShowImages'
114+
testIsEnabled={
115+
getSetting(settings.SHOW_DASHBOARD_IMAGES, this.props.settings) === true
116+
}
117+
prefKey={settings.SHOW_DASHBOARD_IMAGES}
118+
settings={this.props.settings}
119+
onChangeSetting={this.props.onChangeSetting}
120+
/>
121+
</SettingItem>
122+
</SettingsList>
123+
</div>
124+
)
125+
}
126+
}
127+
128+
module.exports = TabsTab

‎js/about/preferences.js

+2-38
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ const BrowserButton = require('../../app/renderer/components/common/browserButto
2020

2121
// Tabs
2222
const PaymentsTab = require('../../app/renderer/components/preferences/paymentsTab')
23+
const TabsTab = require('../../app/renderer/components/preferences/tabsTab')
2324
const SyncTab = require('../../app/renderer/components/preferences/syncTab')
2425
const PluginsTab = require('../../app/renderer/components/preferences/pluginsTab')
2526
const ExtensionsTab = require('../../app/renderer/components/preferences/extensionsTab')
@@ -34,7 +35,7 @@ const messages = require('../constants/messages')
3435
const settings = require('../constants/settings')
3536
const {changeSetting} = require('../../app/renderer/lib/settingsUtil')
3637
const {passwordManagers, extensionIds} = require('../constants/passwordManagers')
37-
const {startsWithOption, newTabMode, bookmarksToolbarMode, tabCloseAction, fullscreenOption, autoplayOption} = require('../../app/common/constants/settingsEnums')
38+
const {startsWithOption, newTabMode, bookmarksToolbarMode, fullscreenOption, autoplayOption} = require('../../app/common/constants/settingsEnums')
3839

3940
const aboutActions = require('./aboutActions')
4041
const appActions = require('../actions/appActions')
@@ -336,43 +337,6 @@ class SearchTab extends ImmutableComponent {
336337
}
337338
}
338339

339-
class TabsTab extends ImmutableComponent {
340-
render () {
341-
return <div>
342-
<DefaultSectionTitle data-l10n-id='tabSettings' />
343-
<SettingsList>
344-
<SettingItem dataL10nId='tabsPerTabPage'>
345-
<SettingDropdown
346-
value={getSetting(settings.TABS_PER_PAGE, this.props.settings)}
347-
data-type='number'
348-
onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TABS_PER_PAGE)}>
349-
{
350-
// Sorry, Brad says he hates primes :'(
351-
[6, 8, 10, 20, 100].map((x) =>
352-
<option value={x} key={x}>{x}</option>)
353-
}
354-
</SettingDropdown>
355-
</SettingItem>
356-
<SettingItem dataL10nId='tabCloseAction'>
357-
<SettingDropdown
358-
value={getSetting(settings.TAB_CLOSE_ACTION, this.props.settings)}
359-
onChange={changeSetting.bind(null, this.props.onChangeSetting, settings.TAB_CLOSE_ACTION)}>
360-
<option data-l10n-id='tabCloseActionLastActive' value={tabCloseAction.LAST_ACTIVE} />
361-
<option data-l10n-id='tabCloseActionNext' value={tabCloseAction.NEXT} />
362-
<option data-l10n-id='tabCloseActionParent' value={tabCloseAction.PARENT} />
363-
</SettingDropdown>
364-
</SettingItem>
365-
<SettingCheckbox dataL10nId='switchToNewTabs' prefKey={settings.SWITCH_TO_NEW_TABS} settings={this.props.settings} onChangeSetting={this.props.onChangeSetting} />
366-
<SettingCheckbox dataL10nId='paintTabs' prefKey={settings.PAINT_TABS} settings={this.props.settings} onChangeSetting={this.props.onChangeSetting} />
367-
<SettingCheckbox dataL10nId='showTabPreviews' prefKey={settings.SHOW_TAB_PREVIEWS} settings={this.props.settings} onChangeSetting={this.props.onChangeSetting} />
368-
<SettingItem dataL10nId='dashboardSettingsTitle'>
369-
<SettingCheckbox dataL10nId='dashboardShowImages' prefKey={settings.SHOW_DASHBOARD_IMAGES} settings={this.props.settings} onChangeSetting={this.props.onChangeSetting} />
370-
</SettingItem>
371-
</SettingsList>
372-
</div>
373-
}
374-
}
375-
376340
class SitePermissionsPage extends React.Component {
377341
hasEntryForPermission (name) {
378342
return this.props.siteSettings.some((value) => {

‎test/lib/selectors.js

+5-1
Original file line numberDiff line numberDiff line change
@@ -128,5 +128,9 @@ module.exports = {
128128
downloadRemoveFromList: '[data-test-id="downloadRemoveFromList"]',
129129

130130
siteInfoDialog: '[data-test-id="siteInfoDialog"]',
131-
viewCertificateButton: '[data-test-id="viewCertificate"]'
131+
viewCertificateButton: '[data-test-id="viewCertificate"]',
132+
133+
// about:preferences#tabs
134+
tabsPerTabPageActiveOption: '[data-test-id="tabsPerTabPageOption"][data-test-active="true"]',
135+
tabCloseActionActiveOption: '[data-test-id="tabCloseActionActiveOption"][data-test-active="true"]'
132136
}

0 commit comments

Comments
 (0)