Our blazing fast Grid component built with pure JavaScript

Post by trudog »

We are using arrays of class instances for our data with the Grid basic component, and if we use a computed for one of our properties in the class, we get this error: TypeError: 'set' on proxy: trap returned falsish for property ‘someRef’ during page rendering.

This is the class definition in our PageProxyError.vue page:

class ProxyTest {
  constructor(public name: string) {}

  // having a ref in our class causes:
  // TypeError: 'set' on proxy: trap returned falsish for property 'someRef'
  // NOTE: uncomment this ref to see the error
  // someRef = computed(() => {
  //   return 'test'
  // })

We updated the project in the GitHub repo (https://github.com/nethopper2/bryntum) and added a new page for this “bug” named “Proxy Bug” so you can reproduce it readily. When you click the page link, you will see a blank page and errors in the console log.

To reproduce the bug, simply uncomment lines 24-26 in PageProxyError.vue.

Thanks for the help!

Post by alex.l »

Hi trudog,

Thank you for the test case!
The problem is that ProxyTest instance is not based on Core.data.Model and not a simple object, which we only allow to use in store data (check docs https://bryntum.com/docs/gantt/api/Core/data/Store#config-data )
The name field still can be read and set by our code (no errors in very simple data loading), which is not possible with someRef field that will be also recognized as record field (we still able to get value with proxyTestInstance.someRef but cannot set it like proxyTestInstance.someRef = 'newValue', as you can see in error message).

Shortly, you need to use simple objects array as data or array of records based on https://bryntum.com/docs/gantt/api/Core/data/Model class.

All the best,

Post by alex.l »

If you explain us what do you want to achieve by using that data format in stores, we could help you to find the way to achieve your goals using another approach.

All the best,

Post by trudog »

Thanks for the quick reply Alex and helpful comments. We are focusing the other Vue3 issue first. Will get back to you once we have something to report.

Post Reply