diff --git a/src/app.js b/src/app.js
index 9a9e06ff..69854509 100644
--- a/src/app.js
+++ b/src/app.js
@@ -12,7 +12,7 @@ import { Provider } from 'react-redux';
 import difference from 'lodash/difference';
 import mapValues from 'lodash/mapValues';
 import moment from 'moment';
-import { IntlProvider } from 'react-intl';
+import { IntlProvider } from './util/reactIntl';
 import configureStore from './store';
 import routeConfiguration from './routeConfiguration';
 import Routes from './Routes';
@@ -86,7 +86,7 @@ export const ClientApp = props => {
   const { store } = props;
   setupLocale();
   return (
-    <IntlProvider locale={config.locale} messages={localeMessages}>
+    <IntlProvider locale={config.locale} messages={localeMessages} textComponent="span">
       <Provider store={store}>
         <HelmetProvider>
           <BrowserRouter>
@@ -107,7 +107,7 @@ export const ServerApp = props => {
   setupLocale();
   HelmetProvider.canUseDOM = false;
   return (
-    <IntlProvider locale={config.locale} messages={localeMessages}>
+    <IntlProvider locale={config.locale} messages={localeMessages} textComponent="span">
       <Provider store={store}>
         <HelmetProvider context={helmetContext}>
           <StaticRouter location={url} context={context}>
diff --git a/src/util/test-helpers.js b/src/util/test-helpers.js
index d534a750..e24681ac 100644
--- a/src/util/test-helpers.js
+++ b/src/util/test-helpers.js
@@ -3,10 +3,10 @@ import mapValues from 'lodash/mapValues';
 import Enzyme, { shallow, mount } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
 import toJson from 'enzyme-to-json';
-import { IntlProvider } from 'react-intl';
 import { BrowserRouter } from 'react-router-dom';
 import { Provider } from 'react-redux';
 import configureStore from '../store';
+import { IntlProvider } from './reactIntl';
 
 // In case you have translated the template and have new translations that
 // are missing from the en translations file, the language for the tests can
@@ -24,7 +24,7 @@ const testMessages = mapValues(messages, (val, key) => key);
 export const TestProvider = props => {
   const store = configureStore();
   return (
-    <IntlProvider locale="en" messages={testMessages}>
+    <IntlProvider locale="en" messages={testMessages} textComponent="span">
       <BrowserRouter>
         <Provider store={store}>{props.children}</Provider>
       </BrowserRouter>