diff --git a/src/data/utils/dataUtils.js b/src/data/utils/dataUtils.js
index 52830137..b61a4d20 100644
--- a/src/data/utils/dataUtils.js
+++ b/src/data/utils/dataUtils.js
@@ -68,3 +68,13 @@ export const getActivationStatus = () => {
return params.account_activation_status;
};
+
+export const isScrollBehaviorSupported = () => 'scrollBehavior' in document.documentElement.style;
+
+export const windowScrollTo = (options) => {
+ if (isScrollBehaviorSupported()) {
+ return window.scrollTo(options);
+ }
+
+ return window.scrollTo(options.top, options.left);
+};
diff --git a/src/data/utils/index.js b/src/data/utils/index.js
index 261839a2..55710159 100644
--- a/src/data/utils/index.js
+++ b/src/data/utils/index.js
@@ -5,5 +5,6 @@ export {
updatePathWithQueryParams,
getAllPossibleQueryParam,
getActivationStatus,
+ windowScrollTo,
} from './dataUtils';
export { default as AsyncActionType } from './reduxUtils';
diff --git a/src/forgot-password/ForgotPasswordPage.jsx b/src/forgot-password/ForgotPasswordPage.jsx
index 7cb1ab8d..7d8d2c5b 100644
--- a/src/forgot-password/ForgotPasswordPage.jsx
+++ b/src/forgot-password/ForgotPasswordPage.jsx
@@ -28,7 +28,7 @@ import {
import APIFailureMessage from '../common-components/APIFailureMessage';
import { INTERNAL_SERVER_ERROR, LOGIN_PAGE, VALID_EMAIL_REGEX } from '../data/constants';
import LoginHelpLinks from '../login/LoginHelpLinks';
-import { updatePathWithQueryParams } from '../data/utils';
+import { updatePathWithQueryParams, windowScrollTo } from '../data/utils';
const ForgotPasswordPage = (props) => {
const { intl, status } = props;
@@ -76,7 +76,7 @@ const ForgotPasswordPage = (props) => {
const validationMessage = getValidationMessage(values.email);
if (validationMessage !== '') {
- window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
+ windowScrollTo({ left: 0, top: 0, behavior: 'smooth' });
return { email: validationMessage };
}
diff --git a/src/login/LoginPage.jsx b/src/login/LoginPage.jsx
index e36828ae..25379a4c 100644
--- a/src/login/LoginPage.jsx
+++ b/src/login/LoginPage.jsx
@@ -33,7 +33,7 @@ import {
} from '../data/constants';
import { forgotPasswordResultSelector } from '../forgot-password';
import {
- getTpaProvider, getTpaHint, updatePathWithQueryParams, getAllPossibleQueryParam, getActivationStatus,
+ getTpaProvider, getTpaHint, updatePathWithQueryParams, getAllPossibleQueryParam, getActivationStatus, windowScrollTo,
} from '../data/utils';
class LoginPage extends React.Component {
@@ -190,7 +190,7 @@ class LoginPage extends React.Component {
/>
)}
{this.props.loginError ? : null}
- {submitState === DEFAULT_STATE && this.state.isSubmitted ? window.scrollTo({ left: 0, top: 0, behavior: 'smooth' }) : null}
+ {submitState === DEFAULT_STATE && this.state.isSubmitted ? windowScrollTo({ left: 0, top: 0, behavior: 'smooth' }) : null}
{activationMsgType && }
{this.props.forgotPassword.status === 'complete' && !this.props.loginError ? (
diff --git a/src/register/RegistrationFailure.jsx b/src/register/RegistrationFailure.jsx
index 13eb6b02..45edb90e 100644
--- a/src/register/RegistrationFailure.jsx
+++ b/src/register/RegistrationFailure.jsx
@@ -7,6 +7,7 @@ import { Alert } from '@edx/paragon';
import { FORBIDDEN_REQUEST, INTERNAL_SERVER_ERROR } from './data/constants';
import messages from './messages';
import { DEFAULT_STATE, PENDING_STATE } from '../data/constants';
+import { windowScrollTo } from '../data/utils';
const RegistrationFailureMessage = (props) => {
const errorMessage = props.errors;
@@ -15,7 +16,7 @@ const RegistrationFailureMessage = (props) => {
useEffect(() => {
if (props.isSubmitted && props.submitButtonState !== PENDING_STATE) {
- window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
+ windowScrollTo({ left: 0, top: 0, behavior: 'smooth' });
}
});
diff --git a/src/reset-password/ResetPasswordPage.jsx b/src/reset-password/ResetPasswordPage.jsx
index 57ca0969..923fe528 100644
--- a/src/reset-password/ResetPasswordPage.jsx
+++ b/src/reset-password/ResetPasswordPage.jsx
@@ -22,6 +22,7 @@ import {
} from '../common-components';
import Spinner from './Spinner';
import { API_RATELIMIT_ERROR, INTERNAL_SERVER_ERROR } from '../data/constants';
+import { windowScrollTo } from '../data/utils';
const ResetPasswordPage = (props) => {
const { intl } = props;
@@ -81,7 +82,7 @@ const ResetPasswordPage = (props) => {
const handleSubmit = (e) => {
e.preventDefault();
- window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
+ windowScrollTo({ left: 0, top: 0, behavior: 'smooth' });
if (newPasswordInput === '') {
setPasswordValidValue(false);
setvalidationMessage(intl.formatMessage(messages['reset.password.empty.new.password.field.error']));