Commit f0233ee0 authored by Jeff Avallone's avatar Jeff Avallone

Hiding content that requires JS when JS is disabled

parent c7ea0659
......@@ -3,6 +3,7 @@
exports[`Form rendering 1`] = `
<div
className="form"
data-requires-js={true}
>
<form
onSubmit={[Function]}
......
......@@ -53,7 +53,7 @@ class Form extends React.PureComponent {
} = this.props;
const { expr, syntax } = this.state;
return <div className={ style.form }>
return <div className={ style.form } data-requires-js>
<form onSubmit={ this.handleSubmit }>
<textarea
name="expr"
......
......@@ -39,7 +39,9 @@ exports[`Header rendering 1`] = `
</WithMergedOptions(TransComponent)>
</mockConstructor>
</li>
<li>
<li
data-requires-js={true}
>
<LoadNamespace(LocaleSwitcher) />
</li>
</ul>
......@@ -85,7 +87,9 @@ exports[`Header rendering with no banner 1`] = `
</WithMergedOptions(TransComponent)>
</mockConstructor>
</li>
<li>
<li
data-requires-js={true}
>
<LoadNamespace(LocaleSwitcher) />
</li>
</ul>
......
......@@ -31,7 +31,7 @@ export const Header = ({ banner }) => (
<Trans>Privacy Policy</Trans>
</Link>
</li>
<li>
<li data-requires-js>
<LocaleSwitcher />
</li>
</ul>
......
......@@ -2,6 +2,17 @@
exports[`Layout rendering 1`] = `
<SentryBoundary>
<noscript>
<style
type="text/css"
>
[data-requires-js] {
display: none !important;
}
</style>
</noscript>
<LoadNamespace(Header)
banner="Test Banner"
/>
......
......@@ -17,7 +17,16 @@ const query = graphql`
}
`;
const noscriptStyle = `
[data-requires-js] {
display: none !important;
}
`;
export const Layout = ({ banner, buildId, children }) => <SentryBoundary>
<noscript>
<style type="text/css">{ noscriptStyle }</style>
</noscript>
<Header banner={ banner } />
<SentryBoundary>
{ children }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment