Changes in data provider from vaadin-grid 3.0.2 to 4.1.7

Flow
1

Hello again,

I am currently struggling to upgrade my use of vaadin-grid from 3.0.2 to 4.1.7,
and have encountered some issues which are difficult to resolve with respect
to the data provider.

Let me first explain the model I am working with:

  1. The data provider uses AJAX calls to a RESTful service.
  2. The calls are paged (offset, limit).
  3. The backend implements the necessary sorting and filtering according to the parameters given to the provider.
  4. The total number of items which a given query will return cannot be known in advance, so it must be deduced (the last size when no further items are returned).
  5. Hence, the provider update procedure is to call the callback with the current items, and update the size to the total + page size, until no more items, in which case, the table size is set to exactly the total number of items received.

This all worked perfectly well in 3.0.2. In 4.1.7, however, I notice the following:

  1. On page load, the provider is called multiple times with the same page (0). This makes asynchronous processing tricky.
  2. On page load, the table cache gets messed up. The rows do not correspond to the data which appears to be given (at least via console logging) to the callback function.
  3. On refresh or filter change (which clears the provider cache), however, everything goes back to normal –– I imagine because there is no more than one AJAX call in flight at a given time.
  4. On load, the details expansion does not work. It works after refresh, however.
  5. When I try to filter and the filter query returns 0 results, I see the following error reported:
TypeError: Argument 1 ('node') to Node.insertBefore must be an instance of Node

I realize this is all very difficult to understand without seeing my code, but I at least wanted to see if I could start a discussion here which might put me on the right track to resolution.

Note: What I am currently doing is trying to block multiple calls to fetch data for the same page without clearing the cache (i.e., without provoking another page load). This hack, however, at least as I have implemented it, is insufficient, because the problems reported above occur in spite of it.

Thanks in advance for any thoughts you might have,

Al Rossi

2

This is what I see on page load:

runProvider is the function assigned to the data provider.

Note that it looks like it is called during DOM construction when a new filter element is added to the table:

[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)
[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[{"path":"severity","value":""}]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)
[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[{"path":"severity","value":""},{"path":"type","value":""}]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)
[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[{"path":"severity","value":""},{"path":"type","value":""},{"path":"host","value":""}]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)
[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[{"path":"severity","value":""},{"path":"type","value":""},{"path":"host","value":""},{"path":"domain","value":""}]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)
[Log]
 runProvider {"page":0,"pageSize":50,"sortOrders":[],"filters":[{"path":"severity","value":""},{"path":"type","value":""},{"path":"host","value":""},{"path":"domain","value":""},{"path":"service","value":""}]
} (data:text/javascript;charset=utf-8,%0A…%0A, line 138)

Why is this necessary?

Is there some way to set the provider function AFTER the table has been fully built?

Thanks, Al

3

Until I hear back about whether I can set the provider function in such a way as not to get repeated calls, I have just hacked this by passing in the correct number of filters which should be present and returning immediately if they are not.

Yuck.

4

P.S. I forgot to mention that the provider function is set during connectedCallback.

5

Hi Albert,
I can confirm this. Page 0 gets requested 2 times. Can you file an issue about this at https://github.com/vaadin/vaadin-grid/issues

A live example would really help in understanding the rest of the issues. Can you modify this snippet so we can take a look at what’s going on: https://jsbin.com/laxuxah/edit?html,output

6

Actually, Tomi, everything else (except the Type Error) stems from trying to process multiple calls with the same offset/page number into the table data cache. Blocking all calls until the size of the filters array in the parameters object is what it should be fixes all the rest for me.

I will try to get to this in a bit. Thanks for looking into it.

Al

P.S. The Type Error is slightly annoying but non-fatal. Everything works, you just get this error reported in the browser console.