Change the cursor style in RenderWindow

I’m using cellPicker to pick a point on a brain geometry, like in the example from vtk.js website CellPicker,
As I’m using it on a brain geometry with a lot of triangles, the picking process takes time (2 seconds), I need to change the cursor while the picking is not yet finished, I couldn’t do that using simple css / javascript, and I couldn’t do that using the code below:

grw.getRenderWindow().getInteractor().onRightButtonPress(async (callData) => {

  grw.getRenderWindow().getInteractor().getView().setCursor('wait'); // to update the cursor to waiting status

  const pos = callData.position;
  const point = [pos.x, pos.y, 0.0];
  console.log(`Pick at: ${point}`);
  picker.pick(point, grw.getRenderer());

  const pickedCellId = picker.getCellId();
  console.log('Picked cell: ', pickedCellId);
  const pickedPoint =  picker.getPickedPositions();
  const a = pickedPoint[0];
  console.log(`Picked: ${pickedPoint}`);
  grw.getRenderWindow().getInteractor().getView().setCursor('pointer'); // to reset the cursor to its normal status


I’m guessing the browser isn’t getting a chance to update the cursor because it’s blocked in the picker code. One way to verify that is to wrap just your pick code in a setTimeout with a timeout of 0, right after you set the cursor to ‘wait’.

FYI we do have pending work to select cells with hardware picking, which should speed up your picking significantly: WIP: feat(hardwareselector): add hardware picking for point and cell ids by boucaud · Pull Request #2369 · Kitware/vtk-js · GitHub