# How to remove p5.js in browser extension with message

**URL:** <https://discourse.processing.org/t/how-to-remove-p5-js-in-browser-extension-with-message/39655>\
**Category:** Coding Questions\
**Created:** [November 10, 2022, 9:03am UTC](https://discourse.processing.org/t/how-to-remove-p5-js-in-browser-extension-with-message/39655 "2022-11-10T09:03:51Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![premier213](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/premier213/32/17365_2.png) [@premier213](https://discourse.processing.org/u/premier213)\
**Post date:** [November 10, 2022, 9:03am UTC](https://discourse.processing.org/t/how-to-remove-p5-js-in-browser-extension-with-message/39655/1 "2022-11-10T09:03:51Z")

</div>

```auto
// get message
chrome.runtime.onMessage.addListener(gotMessage);
function gotMessage(message, sender, sendResponse) {
  runCanvas(message.val);
}

function runCanvas(value) {
  var stage = (p) => {
    if (value === "nn-edit") {
      createCanvas(p, value);
    }
    if (value === "nn-remove") {
      removeCanvas(p, value);
    }
  };

  let p5c = new p5(stage);
}

const createCanvas = (p, value) => {
  p.setup = () => {
    const parent = p.createDiv();
    parent.id("nn-div");
    if (value === "nn-edit") {
      const c = p.createCanvas(
        p.windowWidth - 20,
        document.documentElement.scrollHeight
      );
      c.parent("nn-div");
      c.position(0, 0);
      c.style("z-index", "10000");
      c.style("pointer-events", "none");
    }
  };
  p.draw = () => {
    const v = p.parent("nn-div");
    v.line(p.mouseX, p.mouseY, p.pmouseX, p.pmouseY);
  };
};

const removeCanvas = (p, value) => {
  if (value === "nn-remove") {
    $("#nn-div").remove();
  }
};

```

this is my code for the chrome extension, how to remove p5 from the content page with loop draw?
