We have observed some unexpected behavior with the React Spreadsheet component lately.
We are attempting to add signatures to the worksheet at the currently selected cell. We understand that this can be done by adding the image (which we gather from another component, and convert to data uri) to the shapes collection in the worksheet using the selected cell for the position.
The problem we are expericing is that adding more than one image to the worksheet inconsistently adds the new image. Some times it will insert as expected, other times it will place an image that is already defined at another location. It does does in a consistent, but odd stack like behavior.
For instance, if I add image A to B1, and try to add image C to D2, D2 may show image A instead of image C, additionally, deleting image A from B1 may then correctly show image C at D2. While other times, inserting a image elsewhere may work as expected. It is very odd.
I've included some sample code that we are using.
const insertSignature = () => { if (!spreadsheet?.current) { return; } // get our image as data, since worksheet image require a datastring const d = signature.current?.toDataURL();
const wi = new WorksheetImage(d); const s = spreadsheet.current; const c1 = s.activeWorksheet.getCell( `R${s.activeCell.row + 1}C${s.activeCell.column + 1}`, CellReferenceMode.R1C1 ); const c2 = s.activeWorksheet.getCell( `R${s.activeCell.row + 2}C${s.activeCell.column + 2}`, CellReferenceMode.R1C1 ); wi.topLeftCornerCell = c1; wi.bottomRightCornerCell = c2;
// need to find the shape at the current location, if it exists, to clear it out const shapes = s.activeWorksheet.shapes(); for (let i = 0; i < shapes.count; i++) { const shape = shapes.item(i); if ( shape.topLeftCornerCell.equals(c1) && shape.bottomRightCornerCell.equals(c2) ) { shapes.remove(shape); break; } }
shapes.add(wi); };
Hello Corey,
I have been investigating into the behavior you are seeing in this case, and I believe that in order to diagnose this behavior further, we will require a runnable, isolated sample project from your end that demonstrates this behavior. I have not been able to reproduce this behavior on my end as of yet.
Looking at the code you have provided, I have to wonder if you are running into a timing issue of when the value of signature.current changes, as that is the best thing I can think of from the code that you have provided. Perhaps something you could do to further test this is to print out the value of your “const d” in each call to the method you are calling to ensure that it is not pointing at the same URL to the browser’s console? This would help you to be able to verify whether you are pointed at the same image when adding multiple images?
Please let me know if you have any other questions or concerns on this matter.
Hi Andrew, I am taking this case over on behalf Corey. Has their been any progress on resolving this? It is holding our release date up. Let me know if you need the license number. Thank you.
Hello Scott & Corey,
My apologies for the delay in response.
I have checked on development issue 274139, and at the time of writing this, it unfortunately has not yet received any attention from our development teams. We are currently in the midst of a new release and are “code-frozen,” so this will not be prioritized until after the upcoming release, but I will see about getting it escalated for you if it is holding up your current release date.
Hi Andrew, is there any more information on this issue?