fix(test): dynamic content in percy snapshots

Use webpack to inject a constant `process.env.IS_PERCY` when
`PERCY_TOKEN` exists in env vars.

Set footer version and Project->Overview date to static strings when
PERCY_TOKEN is set

docs-ui/components/dynamicWrapper.stories.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import {storiesOf} from '@storybook/react';
 import {withInfo} from '@storybook/addon-info';
-// import {action} from '@storybook/addon-actions';
 
 import DynamicWrapper from 'sentry-ui/dynamicWrapper';
 
@@ -9,5 +8,5 @@ storiesOf('DynamicWrapper', module).add(
   'default',
   withInfo(
     'Use this to wrap dynamic content (i.e. dates) for acceptance/snapshot tests. Currently checks for existance of PERCY_TOKEN env var'
-  )(() => <DynamicWrapper fixed="Fixed Content" value={new Date()} />)
+  )(() => <DynamicWrapper fixed="Fixed Content" value={new Date().toString()} />)
 );

src/sentry/static/sentry/app/components/footer.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import ConfigStore from '../stores/configStore';
 import HookStore from '../stores/hookStore';
 import {t} from '../locale';
+import DynamicWrapper from './dynamicWrapper';
 
 const Footer = React.createClass({
   getInitialState() {
@@ -34,7 +35,8 @@ const Footer = React.createClass({
               <a className="hidden-xs" href="/out/">{t('Migrate to SaaS')}</a>}
           </div>
           <div className="version pull-left">
-            {'Sentry'} {config.version.current}
+            {'Sentry '}
+            <DynamicWrapper fixed="Acceptance Test" value={config.version.current} />
           </div>
           <a href="/" className="icon-sentry-logo" />
           {this.state.hooks}

src/sentry/static/sentry/app/views/projectDashboard/chart.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import moment from 'moment';
 import ApiMixin from '../../mixins/apiMixin';
 import BarChart from '../../components/barChart';
+import DynamicWrapper from '../../components/dynamicWrapper';
 import LoadingError from '../../components/loadingError';
 import LoadingIndicator from '../../components/loadingIndicator';
 import ProjectState from '../../mixins/projectState';
@@ -107,7 +108,10 @@ const ProjectChart = React.createClass({
           className="standard-barchart"
         />
         <small className="date-legend">
-          {moment(this.props.dateSince * 1000).format('LL')}
+          <DynamicWrapper
+            fixed="Test Date 1, 2000"
+            value={moment(this.props.dateSince * 1000).format('LL')}
+          />
         </small>
       </div>
     );

webpack.config.js

@@ -161,7 +161,8 @@ var appConfig = {
     new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/), // ignore moment.js locale files
     new webpack.DefinePlugin({
       'process.env': {
-        NODE_ENV: JSON.stringify(process.env.NODE_ENV)
+        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
+        IS_PERCY: JSON.stringify(!IS_PRODUCTION && !!process.env.PERCY_TOKEN)
       }
     }),
     // restrict translation files pulled into dist/app.js to only those specified