Custom Renderer Error

I’m in the process of extending the bpmn modeler. I have made changes to my palette provider by adding the code below to this prepackaged bpmn modelerhttps://github.com/bpmn-io/bpmn-js-examples/tree/master/modeler.

‘dcr-task’: createAction(
‘dcr: Task’, ‘activity’, ‘bpmn-icon-trash’, ‘Create dcr-event TAsk’
),

Now in my renderer I have made functions for my custom shape and it looks like this:

‘dcr:Task’: function (parent, element) {

        if (element.width < 250) {
            element.width = 200;
        }
        if (element.height < 250) {
            element.height = 200;
        }

        var elementObject = drawRectWithHeader(parent, element.width, element.height, 10, {
            header: {
                fill: '#006033',
                stroke: '#006033'
            }, body: {fill: '#fff', stroke: '#006033'}
        })

function drawRectWithHeader(parentGfx, width, height, r, attrs) {

    var size = getHeaderSize({width: width, height: height});
    var headerRect = drawRect(parentGfx, size.width, size.height, 0, 0, attrs.header);

    var rect = svgCreate('rect');
    svgAttr(rect, {
        x: 0,
        y: 25,
        width: width,
        height: height - 25
    });
    svgAttr(rect, attrs.body);

    svgAppend(parentGfx, rect);     //877

    return headerRect;
}

function drawRect(parentGfx, width, height, r, offset, attrs) {

    if (isObject(offset)) {
        attrs = offset;
        offset = 0;
    }

    offset = offset || 0;

    attrs = computeStyle(attrs, {
        stroke: 'black',
        strokeWidth: 2,
        fill: 'white'
    });

    var rect = svgCreate('rect');
    svgAttr(rect, {
        x: offset,
        y: offset,
        width: width - offset * 2,
        height: height - offset * 2,
        rx: 5,//r,
        ry: 5//r
    });
    svgAttr(rect, attrs);           //928

    svgAppend(parentGfx, rect);

    return rect;
}       //920

Now when I run the code and try to drag start, I get the error:

index.esm.js:543

   Uncaught Error: unknown type <dcr: Task>
at ./node_modules/moddle/dist/index.esm.js.Registry.mapTypes (index.esm.js:543:1)
at ./node_modules/moddle/dist/index.esm.js.Registry.getEffectiveDescriptor (index.esm.js:568:1)
at ./node_modules/moddle/dist/index.esm.js.Moddle.getType (index.esm.js:859:1)
at ./node_modules/moddle/dist/index.esm.js.Moddle.create (index.esm.js:827:1)
at ./node_modules/bpmn-js/lib/features/modeling/BpmnFactory.js.BpmnFactory.create (BpmnFactory.js:75:1)
at ./node_modules/bpmn-js/lib/features/modeling/ElementFactory.js.ElementFactory.createBpmnElement (ElementFactory.js:83:1)
at ./node_modules/bpmn-js/lib/features/modeling/ElementFactory.js.ElementFactory.create (ElementFactory.js:66:1)
at ./node_modules/diagram-js/lib/core/ElementFactory.js.ElementFactory.createShape (ElementFactory.js:24:1)
at Object.createListener (DCRPaletteProvider.js:39:1)
at ./node_modules/diagram-js/lib/features/palette/Palette.js.Palette.trigger (Palette.js:316:1)

./node_modules/moddle/dist/index.esm.js.Registry.mapTypes @ index.esm.js:543
./node_modules/moddle/dist/index.esm.js.Registry.getEffectiveDescriptor @ index.esm.js:568
./node_modules/moddle/dist/index.esm.js.Moddle.getType @ index.esm.js:859
./node_modules/moddle/dist/index.esm.js.Moddle.create @ index.esm.js:827
./node_modules/bpmn-js/lib/features/modeling/BpmnFactory.js.BpmnFactory.create @ BpmnFactory.js:75
./node_modules/bpmn-js/lib/features/modeling/ElementFactory.js.ElementFactory.createBpmnElement @ ElementFactory.js:83
./node_modules/bpmn-js/lib/features/modeling/ElementFactory.js.ElementFactory.create @ ElementFactory.js:66
./node_modules/diagram-js/lib/core/ElementFactory.js.ElementFactory.createShape @ ElementFactory.js:24
createListener @ DCRPaletteProvider.js:39
./node_modules/diagram-js/lib/features/palette/Palette.js.Palette.trigger @ Palette.js:316
(anonymous) @ Palette.js:156
(anonymous) @ index.esm.js:407

And I don’t know why that is the case as the tags types are the same. Any assistance with this will be helpful.

Remove the space and try again?

I did that and I get the same error.

You need to make sure that the moddle extension that defines dcr:Task is known to the editor.