@pie-lib/editable-html-tip-tap 1.2.0-next.11 → 1.2.0-next.13

package/src/extensions/__tests__/responseArea.test.js

@@ -101,6 +101,163 @@ describe('ResponseAreaExtension', () => {
       expect(commands).toHaveProperty('insertResponseArea');
       expect(typeof commands.insertResponseArea).toBe('function');
     });
+
+    it('returns refreshResponseArea command', () => {
+      const commands = ResponseAreaExtension.addCommands();
+
+      expect(commands).toHaveProperty('refreshResponseArea');
+      expect(typeof commands.refreshResponseArea).toBe('function');
+    });
+
+    it('refreshResponseArea handles node with attrs safely', () => {
+      const context = {
+        options: {
+          type: 'explicit-constructed-response',
+          maxResponseAreas: 5,
+        },
+      };
+
+      const commands = ResponseAreaExtension.addCommands.call(context);
+      const refreshCommand = commands.refreshResponseArea();
+
+      // Mock transaction and state
+      const mockNode = {
+        attrs: {
+          index: '0',
+          value: 'test',
+        },
+      };
+
+      const mockTr = {
+        setNodeMarkup: jest.fn(),
+        setSelection: jest.fn(),
+      };
+
+      const mockState = {
+        selection: {
+          from: 0,
+          $from: {
+            nodeAfter: mockNode,
+          },
+        },
+        tr: mockTr,
+      };
+
+      const mockCommands = {
+        focus: jest.fn(),
+      };
+
+      const mockDispatch = jest.fn();
+
+      refreshCommand({
+        tr: mockTr,
+        state: mockState,
+        commands: mockCommands,
+        dispatch: mockDispatch,
+      });
+
+      expect(mockTr.setNodeMarkup).toHaveBeenCalled();
+    });
+
+    it('refreshResponseArea handles node without attrs safely (optional chaining)', () => {
+      const context = {
+        options: {
+          type: 'explicit-constructed-response',
+          maxResponseAreas: 5,
+        },
+      };
+
+      const commands = ResponseAreaExtension.addCommands.call(context);
+      const refreshCommand = commands.refreshResponseArea();
+
+      // Mock transaction and state with node that has no attrs
+      const mockNode = null;
+
+      const mockTr = {
+        setNodeMarkup: jest.fn(),
+        setSelection: jest.fn(),
+      };
+
+      const mockState = {
+        selection: {
+          from: 0,
+          $from: {
+            nodeAfter: mockNode,
+          },
+        },
+        tr: mockTr,
+      };
+
+      const mockCommands = {
+        focus: jest.fn(),
+      };
+
+      const mockDispatch = jest.fn();
+
+      // This should not throw an error due to optional chaining on node?.attrs
+      expect(() => {
+        refreshCommand({
+          tr: mockTr,
+          state: mockState,
+          commands: mockCommands,
+          dispatch: mockDispatch,
+        });
+      }).not.toThrow();
+    });
+
+    it('refreshResponseArea updates timestamp in node attributes', () => {
+      const context = {
+        options: {
+          type: 'explicit-constructed-response',
+          maxResponseAreas: 5,
+        },
+      };
+
+      const commands = ResponseAreaExtension.addCommands.call(context);
+      const refreshCommand = commands.refreshResponseArea();
+
+      const mockNode = {
+        attrs: {
+          index: '0',
+          value: 'test',
+          updated: '1234567890',
+        },
+      };
+
+      const mockTr = {
+        setNodeMarkup: jest.fn((pos, type, attrs) => {
+          // Verify that updated timestamp is being set
+          expect(attrs.updated).toBeDefined();
+          expect(attrs.updated).not.toBe('1234567890');
+        }),
+        setSelection: jest.fn(),
+      };
+
+      const mockState = {
+        selection: {
+          from: 0,
+          $from: {
+            nodeAfter: mockNode,
+          },
+        },
+        tr: mockTr,
+      };
+
+      const mockCommands = {
+        focus: jest.fn(),
+      };
+
+      const mockDispatch = jest.fn();
+
+      refreshCommand({
+        tr: mockTr,
+        state: mockState,
+        commands: mockCommands,
+        dispatch: mockDispatch,
+      });
+
+      expect(mockTr.setNodeMarkup).toHaveBeenCalled();
+    });
   });
 });
 

package/src/extensions/math.js

@@ -253,6 +253,7 @@ export const MathNodeView = (props) => {
         ReactDOM.createPortal(
           <div
             ref={toolbarRef}
+            data-toolbar-for={editor.instanceId}
             style={{
               position: 'absolute',
               top: `${position.top}px`,

package/src/extensions/responseArea.js

@@ -188,14 +188,9 @@ export const ResponseAreaExtension = Extension.create({
           // tr.setSelection(NodeSelection.create(tr.doc, usedPos))
 
           // --- Cursor move behavior for certain types (Slate: moveFocusTo next text) ---
-          if (
-            ['math_templated', 'inline_dropdown', 'drag_in_the_blank', 'explicit_constructed_response'].includes(
-              typeName,
-            )
-          ) {
+          if (['math_templated', 'inline_dropdown', 'explicit_constructed_response'].includes(typeName)) {
             tr.setSelection(NodeSelection.create(tr.doc, usedPos));
           } else {
-            // Default: put cursor after inserted node
             const after = usedPos + newInline.nodeSize;
             tr.setSelection(selectionAfterPos(tr.doc, after));
           }
@@ -214,7 +209,7 @@ export const ResponseAreaExtension = Extension.create({
           const node = selection.$from.nodeAfter;
           const nodePos = selection.from;
 
-          tr.setNodeMarkup(nodePos, undefined, { ...node.attrs, updated: `${Date.now()}` });
+          tr.setNodeMarkup(nodePos, undefined, { ...node?.attrs, updated: `${Date.now()}` });
           tr.setSelection(NodeSelection.create(tr.doc, nodePos));
 
           if (dispatch) {