Skip to content

Commit e26d375

Browse files
diracdeltasdiracdeltas
committed
remove all calls to dangerouslySetInnerHTML
fix brave/brave-browser#11642
1 parent 5191afb commit e26d375

File tree

19 files changed

+177
-74
lines changed

19 files changed

+177
-74
lines changed

‎browser/ui/webui/brave_webui_source.cc

+3-19
Original file line numberDiff line numberDiff line change
@@ -105,24 +105,6 @@ void CustomizeWebUIHTMLSource(const std::string &name,
105105
};
106106
AddResourcePaths(source, resources[name]);
107107

108-
/**
109-
* REWARDS
110-
*/
111-
// String used to display not supported region for
112-
// uphold wallet connection
113-
base::string16 rewards_not_supported_region = l10n_util::GetStringFUTF16(
114-
IDS_BRAVE_REWARDS_LOCAL_REDIRECT_MODAL_NOT_ALLOWED,
115-
base::ASCIIToUTF16(kRewardsUpholdSupport));
116-
source->AddString("redirectModalNotAllowed", rewards_not_supported_region);
117-
118-
// Strings which have token replacement in them
119-
base::string16 brave_welcome_page_privacy_desc = l10n_util::GetStringFUTF16(
120-
IDS_BRAVE_WELCOME_PAGE_PRIVACY_DESC,
121-
base::ASCIIToUTF16(kP3ALearnMoreURL),
122-
base::ASCIIToUTF16(kP3ASettingsLink));
123-
source->AddString("privacyDesc",
124-
brave_welcome_page_privacy_desc);
125-
126108
static std::map<std::string, std::vector<WebUISimpleItem> >
127109
localized_strings = {
128110
{
@@ -373,7 +355,8 @@ void CustomizeWebUIHTMLSource(const std::string &name,
373355
{ "skipWelcomeTour", IDS_BRAVE_WELCOME_PAGE_SKIP_BUTTON },
374356
{ "next", IDS_BRAVE_WELCOME_PAGE_NEXT_BUTTON },
375357
{ "done", IDS_BRAVE_WELCOME_PAGE_DONE_BUTTON },
376-
{ "privacyTitle", IDS_BRAVE_WELCOME_PAGE_PRIVACY_TITLE }
358+
{ "privacyTitle", IDS_BRAVE_WELCOME_PAGE_PRIVACY_TITLE },
359+
{ "privacyDesc", IDS_BRAVE_WELCOME_PAGE_PRIVACY_DESC }
377360
}
378361
}, {
379362
std::string("rewards"), {
@@ -468,6 +451,7 @@ void CustomizeWebUIHTMLSource(const std::string &name,
468451
{ "redirectModalErrorWallet", IDS_BRAVE_REWARDS_LOCAL_REDIRECT_MODAL_ERROR_WALLET }, // NOLINT
469452
{ "redirectModalBatLimitTitle", IDS_BRAVE_REWARDS_LOCAL_REDIRECT_MODAL_BAT_LIMIT_TITLE }, // NOLINT
470453
{ "redirectModalBatLimitText", IDS_BRAVE_REWARDS_LOCAL_REDIRECT_MODAL_BAT_LIMIT_TEXT }, // NOLINT
454+
{ "redirectModalNotAllowed", IDS_BRAVE_REWARDS_LOCAL_REDIRECT_MODAL_NOT_ALLOWED}, // NOLINT
471455

472456
{ "click", IDS_BRAVE_REWARDS_LOCAL_ADS_CONFIRMATION_TYPE_CLICK },
473457
{ "dismiss", IDS_BRAVE_REWARDS_LOCAL_ADS_CONFIRMATION_TYPE_DISMISS },

‎build/commands/scripts/checkSecurity.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@
55

66
const execSync = require('child_process').execSync
77

8-
// Grep for any usage of innerHTML. TODO: add dangerouslySetInnerHTML.
8+
// Grep for any usage of innerHTML / document.write.
99
// Ping @security-team before changing this.
10-
const cmd = "git grep --extended-regexp '(innerHTML|document.write)' ':(exclude)*test.cc' ':(exclude)test/*' ':(exclude)*.json' ':(exclude)build/*' ':(exclude)*browsertest*.cc'"
10+
const cmd = "git grep -i --extended-regexp '(innerHTML|document.write)' ':(exclude)*test.cc' ':(exclude)test/*' ':(exclude)*.json' ':(exclude)build/*' ':(exclude)*browsertest*.cc'"
1111

1212
try {
1313
const stdout = execSync(cmd)

‎components/brave_rewards/resources/page/components/pageWallet.tsx

+11-2
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { AlertWallet, WalletState } from '../../ui/components/walletWrapper'
2020
import { Provider } from '../../ui/components/profile'
2121
import { DetailRow as PendingDetailRow, PendingType } from '../../ui/components/tablePending'
2222
// Utils
23-
import { getLocale } from '../../../../common/locale'
23+
import { getLocale, getLocaleTags } from '../../../../common/locale'
2424
import * as rewardsActions from '../actions/rewards_actions'
2525
import * as utils from '../utils'
2626
import WalletOff from '../../ui/components/walletOff'
@@ -752,7 +752,16 @@ class PageWallet extends React.Component<Props, State> {
752752

753753
// ledger::type::Result::CORRUPTED_DATA
754754
if (walletRecoveryStatus === 17) {
755-
return <span dangerouslySetInnerHTML={{ __html: getLocale('walletRecoveryOutdated') }} />
755+
const tags = getLocaleTags('walletRecoveryOutdated')
756+
return (
757+
<span>
758+
{tags.beforeTag}
759+
<a href='https://brave.com/faq#convert-old-keys' target='_blank' rel='noopener noreferrer'>
760+
{tags.duringTag}
761+
</a>
762+
{tags.afterTag}
763+
</span>
764+
)
756765
}
757766

758767
if (walletRecoveryStatus !== 0) {

‎components/brave_rewards/resources/page/components/settingsPage.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -223,7 +223,7 @@ class SettingsPage extends React.Component<Props, State> {
223223
return (
224224
<ModalRedirect
225225
id={'redirect-modal-not-allowed'}
226-
errorText={{ __html: getLocale('redirectModalNotAllowed') }}
226+
errorText={getLocale('redirectModalNotAllowed')}
227227
titleText={getLocale('redirectModalErrorWallet')}
228228
buttonText={getLocale('redirectModalClose')}
229229
onClick={this.actions.hideRedirectModal}
@@ -236,7 +236,7 @@ class SettingsPage extends React.Component<Props, State> {
236236
<ModalRedirect
237237
id={'redirect-modal-bat-limit'}
238238
titleText={getLocale('redirectModalBatLimitTitle')}
239-
errorText={{ __html: getLocale('redirectModalBatLimitText') }}
239+
errorText={getLocale('redirectModalBatLimitText')}
240240
buttonText={getLocale('redirectModalClose')}
241241
onClick={this.actions.hideRedirectModal}
242242
/>
@@ -247,7 +247,7 @@ class SettingsPage extends React.Component<Props, State> {
247247
return (
248248
<ModalRedirect
249249
id={'redirect-modal-error'}
250-
errorText={{ __html: getLocale('redirectModalError') }}
250+
errorText={getLocale('redirectModalError')}
251251
buttonText={getLocale('processingRequestButton')}
252252
titleText={getLocale('processingRequest')}
253253
onClick={this.onRedirectError}

‎components/brave_rewards/resources/ui/components/checkout/addFundsPanel/index.tsx

+8-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44

55
import * as React from 'react'
66

7-
import { LocaleContext } from '../localeContext'
7+
import { LocaleContext, getLocaleTags } from '../localeContext'
88
import { DialogTitle } from '../dialogTitle'
99
import { FormSection } from '../formSection'
1010
import { CreditCardForm, CreditCardFormHandle, CreditCardDetails } from '../creditCardForm'
@@ -119,6 +119,8 @@ export function AddFundsPanel (props: AddFundsPanelProps) {
119119
}
120120
}
121121

122+
const tags = getLocaleTags(locale.get('addFundsTermsOfSale'))
123+
122124
return (
123125
<>
124126
<DialogTitle>{locale.get('addFundsTitle')}</DialogTitle>
@@ -165,7 +167,11 @@ export function AddFundsPanel (props: AddFundsPanelProps) {
165167
/>
166168
</PurchaseButtonRow>
167169
<TermsOfSale>
168-
<span dangerouslySetInnerHTML={{ __html: locale.get('addFundsTermsOfSale') }} />
170+
<span>
171+
{tags.beforeTag}
172+
<a href='javascript:void 0'>{tags.duringTag}</a>
173+
{tags.afterTag}
174+
</span>
169175
</TermsOfSale>
170176
</>
171177
)

‎components/brave_rewards/resources/ui/components/checkout/enableRewardsPanel/index.tsx

+10-7
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44

55
import * as React from 'react'
66

7-
import { LocaleContext } from '../localeContext'
7+
import { LocaleContext, getLocaleTags } from '../localeContext'
88

99
import {
1010
Container,
@@ -22,24 +22,27 @@ interface EnableRewardsPanelProps {
2222
export function EnableRewardsPanel (props: EnableRewardsPanelProps) {
2323
const locale = React.useContext(LocaleContext)
2424
const handleClick = () => { props.onEnableRewards() }
25+
const tags = getLocaleTags(locale.get('enableRewardsTerms'))
2526

2627
return (
2728
<Container>
2829
<Title>{locale.get('enableRewardsTitle')}</Title>
2930
<Text>{locale.get('enableRewardsText')}</Text>
30-
<LearnMore
31-
dangerouslySetInnerHTML={{ __html: locale.get('enableRewardsLearnMore') }}
32-
/>
31+
<LearnMore>
32+
<a href='javascript:void 0'>{locale.get('enableRewardsLearnMore')}</a>
33+
</LearnMore>
3334
<EnableRewardsButton
3435
text={locale.get('enableRewardsButtonText')}
3536
size='medium'
3637
onClick={handleClick}
3738
type='accent'
3839
brand='rewards'
3940
/>
40-
<TermsOfService
41-
dangerouslySetInnerHTML={{ __html: locale.get('enableRewardsTerms') }}
42-
/>
41+
<TermsOfService>
42+
{tags.beforeTag}
43+
<a href='javascript: void 0'>{tags.duringTag}</a>
44+
{tags.afterTag}
45+
</TermsOfService>
4346
</Container>
4447
)
4548
}

‎components/brave_rewards/resources/ui/components/checkout/localeContext/index.ts

+9
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,12 @@ export const LocaleContext = React.createContext<LocaleData>({
1313
return 'MISSING'
1414
}
1515
})
16+
17+
export const getLocaleTags = (text: string) => {
18+
const actionIndex: number = text.indexOf('$1')
19+
const actionEndIndex: number = text.indexOf('$2')
20+
const beforeTag = text.substring(0, actionIndex)
21+
const duringTag = text.substring(actionIndex + 2, actionEndIndex)
22+
const afterTag = text.substring(actionEndIndex + 2)
23+
return { beforeTag, duringTag, afterTag }
24+
}

‎components/brave_rewards/resources/ui/components/checkout/useCreditCardPanel/index.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44

55
import * as React from 'react'
66

7-
import { LocaleContext } from '../localeContext'
7+
import { LocaleContext, getLocaleTags } from '../localeContext'
88
import { FormSection } from '../formSection'
99
import { CreditCardForm, CreditCardDetails, CreditCardFormHandle } from '../creditCardForm'
1010
import { GoBackLink } from '../goBackLink'
@@ -31,6 +31,7 @@ interface UseCreditCardPanelProps {
3131
export function UseCreditCardPanel (props: UseCreditCardPanelProps) {
3232
const locale = React.useContext(LocaleContext)
3333
const creditCardFormRef = React.useRef<CreditCardFormHandle>(null)
34+
const tags = getLocaleTags(locale.get('confirmTermsOfSale'))
3435

3536
const onConfirmClick = () => {
3637
const formHandle = creditCardFormRef.current
@@ -83,7 +84,11 @@ export function UseCreditCardPanel (props: UseCreditCardPanelProps) {
8384
</div>
8485
</ConfirmButtonRow>
8586
<TermsOfSale>
86-
<span dangerouslySetInnerHTML={{ __html: locale.get('confirmTermsOfSale') }} />
87+
<span>
88+
{tags.beforeTag}
89+
<a href='javascript:void 0'>{tags.duringTag}</a>
90+
{tags.afterTag}
91+
</span>
8792
</TermsOfSale>
8893
</div>
8994
)

‎components/brave_rewards/resources/ui/components/checkout/useWalletPanel/index.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
import * as React from 'react'
66
import { PlusIcon } from 'brave-ui/components/icons'
77

8-
import { LocaleContext, LocaleData } from '../localeContext'
8+
import { LocaleContext, LocaleData, getLocaleTags } from '../localeContext'
99
import { FormSection } from '../formSection'
1010

1111
import {
@@ -72,6 +72,7 @@ export function UseWalletPanel (props: UseWalletPanelProps) {
7272
}
7373

7474
const locale = React.useContext(LocaleContext)
75+
const tags = getLocaleTags(locale.get('payWithBatTermsOfSale'))
7576

7677
return (
7778
<>
@@ -100,7 +101,11 @@ export function UseWalletPanel (props: UseWalletPanelProps) {
100101
{
101102
props.hasSufficientFunds &&
102103
<TermsOfSale>
103-
<span dangerouslySetInnerHTML={{ __html: locale.get('payWithBatTermsOfSale') }} />
104+
<span>
105+
{tags.beforeTag}
106+
<a href='javascript:void 0'>{tags.duringTag}</a>
107+
{tags.afterTag}
108+
</span>
104109
</TermsOfSale>
105110
}
106111
</>

‎components/brave_rewards/resources/ui/components/modalBackupRestore/index.tsx

+9-1
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
} from './style'
2323
import { TextArea, Modal, Button } from 'brave-ui/components'
2424
import { getLocale } from 'brave-ui/helpers'
25+
import { getLocaleTags } from '../../../../../common/locale'
2526
import { Alert, Tab } from '../'
2627
import ControlWrapper from 'brave-ui/components/formControls/controlWrapper'
2728

@@ -310,13 +311,20 @@ export default class ModalBackupRestore extends React.PureComponent<Props, State
310311
}
311312

312313
getReset = () => {
314+
const tags = getLocaleTags('rewardsResetTextFunds', {
315+
amount: this.props.internalFunds.toString()
316+
})
313317
return (
314318
<>
315319
<StyledTextWrapper>
316320
<StyledText data-test-id={'reset-text'}>
317321
{
318322
this.props.internalFunds > 0
319-
? <span dangerouslySetInnerHTML={{ __html: getLocale('rewardsResetTextFunds', { amount: this.props.internalFunds }) }} />
323+
? <span>
324+
{tags.beforeTag}
325+
<b>{tags.duringTag}</b>
326+
{tags.afterTag}
327+
</span>
320328
: getLocale('rewardsResetTextNoFunds')
321329
}
322330
</StyledText>

‎components/brave_rewards/resources/ui/components/modalRedirect/index.tsx

+23-4
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,11 @@ import {
1313
import Modal from 'brave-ui/components/popupModals/modal/index'
1414
import { LoaderIcon } from 'brave-ui/components/icons'
1515
import { Button } from 'brave-ui/components'
16+
import { splitStringForTag } from '../../../../../common/locale'
1617

1718
export interface Props {
1819
id?: string
19-
errorText?: {
20-
__html: string;
21-
}
20+
errorText?: string
2221
buttonText?: string
2322
titleText?: string
2423
onClick?: () => void
@@ -41,6 +40,10 @@ export default class ModalRedirect extends React.PureComponent<Props, {}> {
4140

4241
render () {
4342
const { id, errorText, titleText } = this.props
43+
let tags = null
44+
if (errorText && errorText.includes('$1')) {
45+
tags = splitStringForTag(errorText, '$1', '$2')
46+
}
4447

4548
return (
4649
<Modal id={id} displayCloseButton={false}>
@@ -51,7 +54,23 @@ export default class ModalRedirect extends React.PureComponent<Props, {}> {
5154
{
5255
errorText
5356
? <StyledError>
54-
<p dangerouslySetInnerHTML={errorText} />
57+
<p>
58+
{
59+
tags
60+
? <>
61+
{tags.beforeTag}
62+
<a
63+
href='https://uphold.com/en/brave/support'
64+
target='_blank'
65+
rel='noopener noreferrer'
66+
>
67+
{tags.duringTag}
68+
</a>
69+
{tags.afterTag}
70+
</>
71+
: errorText
72+
}
73+
</p>
5574
{this.getButton()}
5675
</StyledError>
5776
: <StyledLoader>

‎components/brave_rewards/resources/ui/components/modalVerify/index.tsx

+16-8
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import {
3232
RewardsCheckIcon
3333
} from 'brave-ui/components/icons'
3434
import { Modal } from 'brave-ui/components'
35+
import { getLocaleTags } from '../../../../../common/locale'
3536

3637
export interface Props {
3738
onVerifyClick: () => void
@@ -69,14 +70,21 @@ export default class ModalVerify extends React.PureComponent<Props, {}> {
6970
</>
7071
)
7172

72-
getFooter = () => (
73-
<StyledFooter>
74-
<span dangerouslySetInnerHTML={{ __html: getLocale('walletVerificationFooter') }} />
75-
<StyledFooterIcon>
76-
<UpholdColorIcon />
77-
</StyledFooterIcon>
78-
</StyledFooter>
79-
)
73+
getFooter = () => {
74+
const tags = getLocaleTags('walletVerificationFooter')
75+
return (
76+
<StyledFooter>
77+
<span>
78+
{tags.beforeTag}
79+
<b>{tags.duringTag}</b>
80+
{tags.afterTag}
81+
</span>
82+
<StyledFooterIcon>
83+
<UpholdColorIcon />
84+
</StyledFooterIcon>
85+
</StyledFooter>
86+
)
87+
}
8088

8189
render () {
8290
const {

0 commit comments

Comments
 (0)