Fix usage of default fonts

src/core/p5.Renderer2D.js

@@ -1318,8 +1318,13 @@ class Renderer2D extends p5.Renderer {
       this._setProperty('_textStyle', this._textFont.font.styleName);
     }
 
+    let fontNameString = font || 'sans-serif';
+    if (/\s/.exec(fontNameString)) {
+      // If the name includes spaces, surround in quotes
+      fontNameString = `"${fontNameString}"`;
+    }
     this.drawingContext.font = `${this._textStyle || 'normal'} ${this._textSize ||
-      12}px "${font || 'sans-serif'}"`;
+      12}px ${fontNameString}`;
 
     this.drawingContext.textAlign = this._textAlign;
     if (this._textBaseline === constants.CENTER) {

test/unit/spec.js

@@ -51,7 +51,8 @@ var spec = {
   'visual/cases': [
     // Add the visual tests that you want run as part of CI here. Feel free
     // to omit some for speed if they should only be run manually.
-    'webgl'
+    'webgl',
+    'typography'
   ]
 };
 document.write(

test/unit/visual/cases/typography.js

@@ -0,0 +1,20 @@
+visualSuite('Typography', function() {
+  visualSuite('textFont() with default fonts', function() {
+    visualTest('With the default font', function (p5, screenshot) {
+      p5.createCanvas(50, 50);
+      p5.textSize(20);
+      p5.textAlign(p5.LEFT, p5.TOP);
+      p5.text('test', 0, 0);
+      screenshot();
+    });
+
+    visualTest('With the default monospace font', function (p5, screenshot) {
+      p5.createCanvas(50, 50);
+      p5.textSize(20);
+      p5.textFont('monospace');
+      p5.textAlign(p5.LEFT, p5.TOP);
+      p5.text('test', 0, 0);
+      screenshot();
+    });
+  });
+}, { focus: true });

test/unit/visual/screenshots/Typography/textFont() with default fonts/With the default font/metadata.json

@@ -0,0 +1,3 @@
+{
+  "numScreenshots": 1
+}

test/unit/visual/screenshots/Typography/textFont() with default fonts/With the default monospace font/metadata.json

@@ -0,0 +1,3 @@
+{
+  "numScreenshots": 1
+}

test/visual/visualTestList.js

@@ -1,5 +1,5 @@
 // List all visual test files here that should be manually run
-const visualTestList = ['webgl'];
+const visualTestList = ['webgl', 'typography'];
 
 for (const file of visualTestList) {
   document.write(