diff --git a/e2e/testcafe-devextreme/tests/scheduler/etalons/scheduler-appointments-should-update-color.png b/e2e/testcafe-devextreme/tests/scheduler/etalons/scheduler-appointments-should-update-color.png
new file mode 100644
index 000000000000..31a6dfc76b5c
Binary files /dev/null and b/e2e/testcafe-devextreme/tests/scheduler/etalons/scheduler-appointments-should-update-color.png differ
diff --git a/e2e/testcafe-devextreme/tests/scheduler/workSpace.ts b/e2e/testcafe-devextreme/tests/scheduler/workSpace.ts
index 714e32a2cb12..6380209ec1bb 100644
--- a/e2e/testcafe-devextreme/tests/scheduler/workSpace.ts
+++ b/e2e/testcafe-devextreme/tests/scheduler/workSpace.ts
@@ -1,5 +1,6 @@
 import { ClientFunction } from 'testcafe';
 import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
+import Button from 'devextreme-testcafe-models/button';
 import Scheduler, { CLASS } from 'devextreme-testcafe-models/scheduler';
 import { extend } from 'devextreme/core/utils/extend';
 import { createWidget } from '../../helpers/createWidget';
@@ -360,3 +361,43 @@ test('[T716993]: should has horizontal scrollbar with multiple resources and fix
 }).after(async () => {
   await removeStylesheetRulesFromPage();
 });
+
+test('Scheduler appointments should change color on update resources', async (t) => {
+  const button = new Button('#container');
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await t.click(button.element);
+
+  await takeScreenshot('scheduler-appointments-should-update-color.png');
+  await t.expect(compareResults.isValid()).ok(compareResults.errorMessages());
+}).before(async () => {
+  await createWidget('dxScheduler', {
+    timeZone: 'America/Los_Angeles',
+    dataSource: [{
+      text: 'Website Re-Design Plan',
+      startDate: new Date('2021-03-29T16:30:00.000Z'),
+      endDate: new Date('2021-03-29T18:30:00.000Z'),
+      resource: 1,
+    }],
+    views: ['week', 'month'],
+    currentView: 'week',
+    currentDate: new Date(2021, 2, 28),
+    startDayHour: 9,
+    height: 730,
+    resources: [{
+      fieldExpr: 'resource',
+      dataSource: [{ id: 1, text: 'res 1', color: 'red' }],
+    }],
+  }, '#otherContainer');
+  await createWidget('dxButton', {
+    text: 'Change resources',
+    onClick() {
+      const schedulerWidget = ($('#otherContainer') as any).dxScheduler('instance');
+      schedulerWidget.option('resources', [{
+        fieldExpr: 'resource',
+        dataSource: [{ id: 1, text: 'new res 1', color: 'pink' }],
+      }]);
+      schedulerWidget.getDataSource().reload();
+    },
+  }, '#container');
+});
diff --git a/packages/devextreme/js/__internal/scheduler/m_scheduler.ts b/packages/devextreme/js/__internal/scheduler/m_scheduler.ts
index 7a0d9270c78e..21260c8f6389 100644
--- a/packages/devextreme/js/__internal/scheduler/m_scheduler.ts
+++ b/packages/devextreme/js/__internal/scheduler/m_scheduler.ts
@@ -620,6 +620,7 @@ class Scheduler extends Widget<any> {
         this._dataAccessors.resources = createExpressions(this.option('resources'));
         this.agendaResourceProcessor.initializeState(this.option('resources'));
         this.updateInstances();
+        this.option('resourceLoaderMap').clear();
 
         this._postponeResourceLoading().done((resources) => {
           this._appointments.option('items', []);