diff --git a/CHANGELOG.md b/CHANGELOG.md
index 430137a6cf4..5bfb0452154 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
- Added href prop to `EuiTab` and converted to TypeScript ([#2275](https://github.com/elastic/eui/pull/2275))
- Created `EuiInputPopover` component (formally) ([#2269](https://github.com/elastic/eui/pull/2269))
- Added docs for using [Elastic Charts](https://elastic.github.io/elastic-charts) with EUI ([#2209](https://github.com/elastic/eui/pull/2209))
+- Improved fix for `EuiSuperDatePicker` to update `asyncInterval.isStopped` on a `isPaused` prop change. ([#2298](https://github.com/elastic/eui/pull/2298))
**Bug fixes**
diff --git a/src/components/date_picker/super_date_picker/super_date_picker.js b/src/components/date_picker/super_date_picker/super_date_picker.js
index 01288b44d89..067c1bd41c1 100644
--- a/src/components/date_picker/super_date_picker/super_date_picker.js
+++ b/src/components/date_picker/super_date_picker/super_date_picker.js
@@ -193,9 +193,8 @@ export class EuiSuperDatePicker extends Component {
};
componentDidUpdate = () => {
- if (this.props.isPaused) {
- this.stopInterval();
- } else {
+ this.stopInterval();
+ if (!this.props.isPaused) {
this.startInterval(this.props.refreshInterval);
}
};
diff --git a/src/components/date_picker/super_date_picker/super_date_picker.test.js b/src/components/date_picker/super_date_picker/super_date_picker.test.js
index 23092bcd553..b21e3857a2d 100644
--- a/src/components/date_picker/super_date_picker/super_date_picker.test.js
+++ b/src/components/date_picker/super_date_picker/super_date_picker.test.js
@@ -50,4 +50,57 @@ describe('EuiSuperDatePicker', () => {
expect(instanceUpdatedRefresh.asyncInterval.isStopped).toBe(false);
expect(componentRefresh.prop('isPaused')).toBe(false);
});
+
+ test('Listen for consecutive super date picker refreshes', async () => {
+ jest.useFakeTimers();
+
+ const onRefresh = jest.fn();
+
+ const componentRefresh = mount(
+
+ );
+
+ const instanceRefresh = componentRefresh.instance();
+
+ jest.advanceTimersByTime(10);
+ await instanceRefresh.asyncInterval.__pendingFn;
+ jest.advanceTimersByTime(10);
+ await instanceRefresh.asyncInterval.__pendingFn;
+
+ expect(onRefresh).toBeCalledTimes(2);
+
+ jest.useRealTimers();
+ });
+
+ test('Switching refresh interval to pause should stop onRefresh being called.', async () => {
+ jest.useFakeTimers();
+
+ const onRefresh = jest.fn();
+
+ const componentRefresh = mount(
+
+ );
+
+ const instanceRefresh = componentRefresh.instance();
+
+ jest.advanceTimersByTime(10);
+ await instanceRefresh.asyncInterval.__pendingFn;
+ componentRefresh.setProps({ isPaused: true, refreshInterval: 0 });
+ jest.advanceTimersByTime(10);
+ await instanceRefresh.asyncInterval.__pendingFn;
+
+ expect(onRefresh).toBeCalledTimes(1);
+
+ jest.useRealTimers();
+ });
});