p5.js-web-editor icon indicating copy to clipboard operation
p5.js-web-editor copied to clipboard

print function opens up print webpage popup

Open oneplusiota opened this issue 2 months ago • 5 comments

p5.js version

2.0.5

What is your operating system?

Mac OS

Web browser and version

Google Chrome 140.0.7339.208 (Official Build) (arm64)

Actual Behavior

Using print function to print variables open up the print webpage popup instead of printing in the console.

screenshot for reference:

It happens only when the print function is written without any arguments and the auto-refresh is kept on.

Image

On typing some variable afterwards it correctly prints the variable in the consiole without the above issue.

Image

Expected Behavior

Expecting the code to not open the print popup.

It should either throw some error saying print can't be called with no arguments or should not print anything to console and let the user figure out the error.

Steps to reproduce

Steps:

  1. paste the below code.
  2. run the code and you will see that the print popup shows up

Snippet:

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  print()
}

oneplusiota avatar Oct 05 '25 17:10 oneplusiota

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

welcome[bot] avatar Oct 05 '25 17:10 welcome[bot]

I looked into the implementation of the print() function in the p5.js source, and I found that the behavior originates in src/core/environment.js

This explains why calling print() with no arguments triggers the browser’s print dialog. It explicitly calls window.print() when args.length is zero.

I wanted to confirm with the maintainers whether this behavior is still intentional or if it would make sense to modify it (for example, by throwing a warning or friendly error instead of opening the print dialog). I would like to contribute if possible.

Specifically, the function is defined as:

const` _windowPrint = window.print;
let windowPrintDisabled = false;

p5.prototype.print = function(...args) {
  if (!args.length) {
    if (!windowPrintDisabled) {
      _windowPrint();
      if (
        window.confirm(
          'You just tried to print the webpage. Do you want to prevent this from running again?'
        )
      ) {
        windowPrintDisabled = true;
      }
    }
  } else {
    console.log(...args);
  }
};

NisargJasani0602 avatar Oct 16 '25 20:10 NisargJasani0602

@raclim I've reviewed this issue and understand what needs to be done. I'd be happy to work on it - could you assign it to me?

VatsalCodes44 avatar Oct 30 '25 07:10 VatsalCodes44

Hi! 👋 I’d like to work on this issue.

I checked the implementation mentioned in the earlier comment, but it seems that the file path src/core/environment.js does not exist in the p5.js-web-editor repository.

From what I can tell, this behavior likely comes from the p5.js library itself rather than the web editor. Could you please confirm whether this issue should be fixed here (in the web editor) or in the p5.js core repo? Once confirmed, I’d be happy to work on it.

Thanks!

sdass1918 avatar Nov 08 '25 18:11 sdass1918

Hi! 👋 I’ve identified that the root cause of this issue is in the p5.js core library, not the web editor. I’ve submitted a fix in https://github.com/processing/p5.js/pull/8244 that prevents print() with no arguments from triggering the browser’s print dialog.

Once it’s merged, the updated behaviour will automatically appear in the web editor with the next p5.js release.

Thanks!

sdass1918 avatar Nov 08 '25 18:11 sdass1918