fabricjs how to double-click a picture(or rect) to edit text and name it

How to combine images and text with fabricjs and edit text when double clicking the combined object, Still combine after editing text, Please tell me how to edit text when rendering image and text combinations

const canvas = new fabric.Canvas("canvas");

// a rect
const rect = new fabric.Rect({
  stroke: "#000",
  strokeWidth: 1,
  fill: "#ccc",
  left: 170,
  top: 80,
  width: 50,
  height: 50
});

// a text for describe rect
const text = new fabric.IText("describe rect", {
  fontFamily: "Comic Sans",
  fontSize: 14,
  stroke: "#000",
  strokeWidth: 1,
  fill: "#000",
  left: 170,
  top: 80
});

// 1 Combine the above two things but can not edit text

// 2 use LabeledRect also
How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum