angular-instantsearch icon indicating copy to clipboard operation
angular-instantsearch copied to clipboard

Sporadic facet error message

Open mwawrusch opened this issue 6 years ago • 12 comments

I sporadically get the following error message:

dataType is not a retrieved facet.

The dataType is defined as a facet and faceting works client side (using your widgets).

Here is the stack trace

 at SearchResults.getFacetValues (index.js:647)
    at Object.render (connectRefinementList.js:322)
    at eval (InstantSearch.js:359)
    at arrayEach (_arrayEach.js:15)
    at forEach (forEach.js:38)
    at InstantSearch._render (InstantSearch.js:355)
    at AlgoliaSearchHelper.EventEmitter.emit (events.js:84)
    at eval (algoliasearch.helper.js:1245)
    at arrayEach (_arrayEach.js:15)
    at forEach (forEach.js:38)

mwawrusch avatar Mar 10 '18 19:03 mwawrusch

Would it be possible to create a sandbox in which this happens? Since this isn't happening consistently, I think that it might be possibly something to do with the specific way you're rendering the widgets. There's a template here

Haroenv avatar Mar 12 '18 13:03 Haroenv

So I don't have time to create a sample but looking at this function:

function extractNormalizedFacetValues(results, attribute) {
  var predicate = {name: attribute};
  if (results._state.isConjunctiveFacet(attribute)) {
    var facet = find(results.facets, predicate);
    if (!facet) return [];

    return map(facet.data, function(v, k) {
      return {
        name: k,
        count: v,
        isRefined: results._state.isFacetRefined(attribute, k),
        isExcluded: results._state.isExcludeRefined(attribute, k)
      };
    });
  } else if (results._state.isDisjunctiveFacet(attribute)) {
    var disjunctiveFacet = find(results.disjunctiveFacets, predicate);
    if (!disjunctiveFacet) return [];

    return map(disjunctiveFacet.data, function(v, k) {
      return {
        name: k,
        count: v,
        isRefined: results._state.isDisjunctiveFacetRefined(attribute, k)
      };
    });
  } else if (results._state.isHierarchicalFacet(attribute)) {
    return find(results.hierarchicalFacets, predicate);
  }
}

the last return should be

return find(results.hierarchicalFacets, predicate) || [];

mwawrusch avatar Mar 14 '18 02:03 mwawrusch

Cc @bobylito since this is about the helper

Haroenv avatar Mar 14 '18 06:03 Haroenv

Hi @mwawrusch thanks for reporting this issue. You're right about the return value for the hierarchical facet, it's inconsistent that we return undefined when we find no values. Are you using a hierarchical menu with the dataType attribute?

bobylito avatar Mar 14 '18 08:03 bobylito

Hi Boby, I do not but it was the only obvious potential bug I found so far. The angular implementation on top of the base library fails if that one returns null or undefined so that's my best guess.

mwawrusch avatar Mar 14 '18 11:03 mwawrusch

Which widget are you using with dataType?

Haroenv avatar Mar 14 '18 11:03 Haroenv

        <ng-ais-refinement-list attribute="dataType">
        </ng-ais-refinement-list>

        <ng-ais-current-refined-values [clearAll]="false">
        </ng-ais-current-refined-values>

        <ng-ais-clear-all clearAllLabel="Reset everything">
        </ng-ais-clear-all>

mwawrusch avatar Mar 14 '18 19:03 mwawrusch

I get this everytime, here is my setup with material2.

<span>
  <!-- <input aria-label="search" placeholder="Search" type="search"> -->
  <ng-ais-instantsearch [config]="algoliaConfig" #algoliaSearch>
    <!-- SearchBox -->
    <ng-ais-search-box (focus)="onSearchFocus(true)" #algoliaSearchBox></ng-ais-search-box>

    <!-- Hits -->
    <div id="search-wrapper" class="show-search wrapper" *ngIf="searching">
      <div fxLayout="column" fxLayoutGap="5px">
        <div fxLayout="row">
          <mat-expansion-panel fxFlex="90">
            <mat-expansion-panel-header>
              <mat-panel-title>
                Filters
              </mat-panel-title>
            </mat-expansion-panel-header>
            <mat-list>
              <ng-ais-current-refinements autoHideContainer="true" clearRefinementsLabel="Clear Filter"></ng-ais-current-refinements>
              Category
              <mat-divider></mat-divider>
              <ng-ais-refinement-list attribute="dpCategory">
              </ng-ais-refinement-list>
              Country
              <mat-divider></mat-divider>
              <ng-ais-refinement-list attribute="country" searchable="true">
              </ng-ais-refinement-list>
            </mat-list>
          </mat-expansion-panel>
          <button color="accent" fxFlex="10" fxFlexAlign="start" mat-raised-button (click)="onSearchFocus(false)">
            Close
            <mat-icon aria-label="Close">close</mat-icon>
          </button>
        </div>
        <!-- RefinementList -->
        <div fxLayout="row" fxLayoutAlign="start" fxLayout.xs="column" fxLayoutAlign.xs="start stretch" fxLayoutGap="10px">
          <div fxFlex="25%">
            <!-- Pagination -->
            <ng-ais-pagination [totalPages]="20" [padding]="1">
            </ng-ais-pagination>
          </div>
          <div fxFlex="75%">
            <ng-ais-hits>
              <ng-template let-hits="hits">
                <mat-nav-list class="scrollList">
                  <mat-list-item *ngFor="let hit of hits" (click)="navigate(hit, algoliaSearchBox)" [ngSwitch]="hit.dpCategory">
                    <img matListAvatar [src]="hit.thumbnailURL" alt="." *ngSwitchCase="'wineries'">
                    <img matListAvatar [src]="hit.labelURL" alt="." *ngSwitchCase="'wine'">
                    <ng-ais-highlight attribute="name" [hit]="hit">
                    </ng-ais-highlight>
                  </mat-list-item>
                </mat-nav-list>
              </ng-template>
            </ng-ais-hits>
          </div>
        </div>
      </div>
    </div>
  </ng-ais-instantsearch>
</span>

codercatdev avatar May 07 '18 02:05 codercatdev

Hi @ajonp is it possible to have access to an URL where the bugs happens? Or a small repro case with https://codesandbox.io/s/github/algolia/instantsearch-templates/tree/master/src/Angular%20InstantSearch

This would help a lot, thanks 🙏

iam4x avatar May 17 '18 14:05 iam4x

@iam4x sure you can hit https://www.drinkpublic.net and click the search bar at the top. image

codercatdev avatar May 18 '18 04:05 codercatdev

Getting the same issue. This causes breakage on the page we are using instantsearch on.

logan-jobzmall avatar Dec 23 '19 01:12 logan-jobzmall

Can you explain how this causes breakage please? When I test this the error gets caught and the rendering continues.

Note that this is a fixed upstream issue which will come out with the upgrade to InstantSearch v4

Haroenv avatar Dec 23 '19 08:12 Haroenv

I believe this issue no longer can happen with the latest versions which depend on InstantSearch v4

Haroenv avatar Jan 04 '23 13:01 Haroenv