fix(index): support adding index widget with initial UI state

src/lib/InstantSearch.ts

@@ -483,7 +483,9 @@ See ${createDocumentationLink({
   }
 
   public scheduleSearch = defer(() => {
-    this.mainHelper!.search();
+    if (this.started) {
+      this.mainHelper!.search();
+    }
   });
 
   public scheduleRender = defer(() => {

src/lib/__tests__/escape-highlight-test.js

@@ -246,4 +246,26 @@ describe('escapeHits()', () => {
 
     expect(hits).toEqual(output);
   });
+
+  it('should not mutate the hit', () => {
+    const hit = {
+      _highlightResult: {
+        foobar: {
+          value: '<script>__ais-highlight__foo__/ais-highlight__</script>',
+        },
+      },
+    };
+
+    const hits = [hit];
+
+    escapeHits(hits);
+
+    expect(hit).toEqual({
+      _highlightResult: {
+        foobar: {
+          value: '<script>__ais-highlight__foo__/ais-highlight__</script>',
+        },
+      },
+    });
+  });
 });

src/lib/escape-highlight.ts

@@ -46,13 +46,15 @@ function recursiveEscape(input: any): any {
 
 export default function escapeHits(hits: Hit[]): Hit[] {
   if ((hits as any).__escaped === undefined) {
-    hits = hits.map(hit => {
-      if (hit._highlightResult) {
-        hit._highlightResult = recursiveEscape(hit._highlightResult);
+    // We don't overidde the value on hit because it will mutate the raw results
+    // instead we make a shallow copy and we assigin the escaped values on it.
+    hits = hits.map(({ _highlightResult, _snippetResult, ...hit }) => {
+      if (_highlightResult) {
+        hit._highlightResult = recursiveEscape(_highlightResult);
       }
 
-      if (hit._snippetResult) {
-        hit._snippetResult = recursiveEscape(hit._snippetResult);
+      if (_snippetResult) {
+        hit._snippetResult = recursiveEscape(_snippetResult);
       }
 
       return hit;

src/widgets/index/__tests__/index-test.ts

@@ -1783,6 +1783,58 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/index-widge
         });
       });
     });
+
+    it('uiState on inner index does not get erased on "change"', () => {
+      const level0 = index({ indexName: 'level0IndexName' });
+
+      const searchClient = createSearchClient();
+      const mainHelper = algoliasearchHelper(searchClient, '', {});
+      const instantSearchInstance = createInstantSearch({
+        mainHelper,
+        _initialUiState: {
+          level0IndexName: { query: 'something' },
+        },
+      });
+
+      instantSearchInstance.mainIndex.init(
+        createInitOptions({ instantSearchInstance, parent: null })
+      );
+
+      instantSearchInstance.mainIndex.addWidgets([
+        level0.addWidgets([
+          createConfigure({
+            distinct: false,
+          }),
+          createSearchBox(),
+        ]),
+      ]);
+
+      level0.init(
+        createInitOptions({
+          instantSearchInstance,
+          parent: instantSearchInstance.mainIndex,
+        })
+      );
+
+      // Setting a page is considered as a change
+      level0
+        .getHelper()!
+        .setQueryParameter('page', 4)
+        .search();
+
+      expect(level0.getHelper()!.state.page).toBe(4);
+      expect(level0.getHelper()!.state.query).toBe('something');
+
+      expect(instantSearchInstance.mainIndex.getWidgetState({})).toEqual({
+        indexName: {},
+        level0IndexName: {
+          configure: {
+            distinct: false,
+          },
+          query: 'something',
+        },
+      });
+    });
   });
 
   describe('render', () => {

src/widgets/index/index.ts

@@ -70,7 +70,8 @@ export function isIndexWidget(widget: Widget): widget is Index {
 
 function getLocalWidgetsState(
   widgets: Widget[],
-  widgetStateOptions: WidgetStateOptions
+  widgetStateOptions: WidgetStateOptions,
+  initialUiState: IndexUiState = {}
 ): IndexUiState {
   return widgets
     .filter(widget => !isIndexWidget(widget))
@@ -80,7 +81,7 @@ function getLocalWidgetsState(
       }
 
       return widget.getWidgetState(uiState, widgetStateOptions);
-    }, {});
+    }, initialUiState);
 }
 
 function getLocalWidgetsSearchParameters(
@@ -110,8 +111,12 @@ function resetPageFromWidgets(widgets: Widget[]): void {
   indexWidgets.forEach(widget => {
     const widgetHelper = widget.getHelper()!;
 
-    // @ts-ignore @TODO: remove "ts-ignore" once `resetPage()` is typed in the helper
-    widgetHelper.setState(widgetHelper.state.resetPage());
+    // @ts-ignore remove once resetPage is a helper method
+    widgetHelper._change({
+      // @ts-ignore @TODO: remove "ts-ignore" once `resetPage()` is typed in the helper
+      state: widgetHelper.state.resetPage(),
+      isPageReset: true,
+    });
 
     resetPageFromWidgets(widget.getWidgets());
   });
@@ -225,7 +230,10 @@ const index = (props: IndexProps): Index => {
             widget.init({
               helper: helper!,
               parent: this,
-              uiState: {},
+              // Only index widget uses this key. This means that the initial value
+              // is sufficient, since that index didn't yet exist. If we see wrong
+              // behavior with this, use mainIndex.getWidgetState()
+              uiState: localInstantSearchInstance._initialUiState,
               instantSearchInstance: localInstantSearchInstance,
               state: helper!.state,
               templatesConfig: localInstantSearchInstance.templatesConfig,
@@ -353,6 +361,7 @@ const index = (props: IndexProps): Index => {
       // listener on `change` below, once `init` is done.
       helper.on('change', ({ isPageReset }) => {
         if (isPageReset) {
+          localUiState.page = undefined;
           resetPageFromWidgets(localWidgets);
         }
       });
@@ -403,10 +412,14 @@ const index = (props: IndexProps): Index => {
       // configuration of the widget is pushed in the URL. That's what we want to avoid.
       // https://github.com/algolia/instantsearch.js/pull/994/commits/4a672ae3fd78809e213de0368549ef12e9dc9454
       helper.on('change', ({ state }) => {
-        localUiState = getLocalWidgetsState(localWidgets, {
-          searchParameters: state,
-          helper: helper!,
-        });
+        localUiState = getLocalWidgetsState(
+          localWidgets,
+          {
+            searchParameters: state,
+            helper: helper!,
+          },
+          localUiState
+        );
 
         // We don't trigger an internal change when controlled because it
         // becomes the responsibility of `setUiState`.

test/mock/createInstantSearch.ts

@@ -12,19 +12,17 @@ export const createInstantSearch = (
   const mainHelper = algoliasearchHelper(searchClient, indexName, {});
   const mainIndex = index({ indexName });
 
-  let started = false;
-
   return {
     indexName,
     mainIndex,
     mainHelper,
     client: searchClient,
-    started,
-    start: () => {
-      started = true;
+    started: false,
+    start() {
+      this.started = true;
     },
-    dispose: () => {
-      started = false;
+    dispose() {
+      this.started = false;
     },
     refresh: jest.fn(),
     helper: mainHelper, // @TODO: use the Helper from the index once the RoutingManger uses the index