giyu
giyu•2mo ago

Issue with button functionality working in preview mode but not in deployed mode

Hey guys, I’ve encountered an issue where functionality that works correctly in the preview/draft mode does not seem to work once the application is deployed. In the preview mode, when I press the “Press me” button, it properly marks all checkboxes in the AG Grid component named “c” as ready for review. However, after deploying the application, pressing the same button no longer updates the checkboxes as expected. I’ve attached a video that demonstrates the difference in behavior between the preview and deployed environments. Here is a summary of what I’m experiencing: • In draft/preview mode: • Clicking the “Press me” button results in all checkboxes in the “c” grid being marked as ready for review. • In deployed/production mode: • Clicking the “Press me” button does not update the checkboxes, even though the same code is running. I’ve verified that the code logs and set operations are occurring as intended in preview mode, but in the production environment, the console logs do not appear to show the same output (only “Frontend job started w” is logged). Could you please help investigate why this discrepancy occurs between the preview and deployed modes? Any guidance on how to ensure console logs and the AG Grid updates are visible and functioning correctly in production would be greatly appreciated. Thank you for your assistance.
3 Replies
giyu
giyuOP•2mo ago
The code for modifying the table "c" is below 
// Ensure c and c.result are valid
if (!c || !Array.isArray(c.result)) {
  console.error("No valid data found in c.result.");
  return c;
}

console.log("Original rows:", c.result);

// Update all rows to have is_ready_for_review = true
const updatedData = c.result.map((row, i) => {
  console.log(`Row ${i} before:`, row);
  const newRow = { ...row, is_ready_for_review: true };
  console.log(`Row ${i} after:`, newRow);
  return newRow;
});

console.log("updatedData:", updatedData);

// Create updatedC
const updatedC = { ...c, result: updatedData };

// Update selectedRow if applicable
if (typeof c.selectedRowIndex === 'number' && c.selectedRowIndex < updatedData.length) {
  updatedC.selectedRow = updatedData[c.selectedRowIndex];
}

// Remove 'newChange' if it exists
if ('newChange' in updatedC) {
  delete updatedC.newChange;
}

// Update Windmill's stored value for c
setValue("c", updatedC);

console.log("Updated Data in c:", updatedC);

// Try to get the AG Grid instance
let grid = getAgGrid("c");
console.log("Grid at initial attempt:", grid);

// Sometimes in production, the grid might not be ready immediately.
// We'll try a short delay to ensure the UI updates with new data first.
setTimeout(() => {
  grid = getAgGrid("c");
  console.log("Grid after timeout:", grid);

  if (grid && grid.api) {

    grid.api.forEachNode(node => {
      node.setDataValue('is_ready_for_review', true);
    });
    console.log("All rows in the grid have been marked as ready for review via forEachNode.");
  } else {
    console.warn("Grid still not available after timeout, cannot update UI directly.");
  }

}, 500); // Adjust delay if needed

return updatedC;
// Ensure c and c.result are valid
if (!c || !Array.isArray(c.result)) {
  console.error("No valid data found in c.result.");
  return c;
}

console.log("Original rows:", c.result);

// Update all rows to have is_ready_for_review = true
const updatedData = c.result.map((row, i) => {
  console.log(`Row ${i} before:`, row);
  const newRow = { ...row, is_ready_for_review: true };
  console.log(`Row ${i} after:`, newRow);
  return newRow;
});

console.log("updatedData:", updatedData);

// Create updatedC
const updatedC = { ...c, result: updatedData };

// Update selectedRow if applicable
if (typeof c.selectedRowIndex === 'number' && c.selectedRowIndex < updatedData.length) {
  updatedC.selectedRow = updatedData[c.selectedRowIndex];
}

// Remove 'newChange' if it exists
if ('newChange' in updatedC) {
  delete updatedC.newChange;
}

// Update Windmill's stored value for c
setValue("c", updatedC);

console.log("Updated Data in c:", updatedC);

// Try to get the AG Grid instance
let grid = getAgGrid("c");
console.log("Grid at initial attempt:", grid);

// Sometimes in production, the grid might not be ready immediately.
// We'll try a short delay to ensure the UI updates with new data first.
setTimeout(() => {
  grid = getAgGrid("c");
  console.log("Grid after timeout:", grid);

  if (grid && grid.api) {

    grid.api.forEachNode(node => {
      node.setDataValue('is_ready_for_review', true);
    });
    console.log("All rows in the grid have been marked as ready for review via forEachNode.");
  } else {
    console.warn("Grid still not available after timeout, cannot update UI directly.");
  }

}, 500); // Adjust delay if needed

return updatedC;
rubenf
rubenf•2mo ago
self-hosted or cloud, what version? update your versions of windmill to latest releases, we had some issues with frontend script a few releases ago
giyu
giyuOP•2mo ago
this is self hosted - CE v1.435.2-17-g8e9cb9c4d let me try to update it perfect it works!

Did you find this page helpful?