Here's what I found out by following this link.
context.drawImage can take an img, canvas, or video element. So you can decide to use the contents of an off-screen canvas as a pattern.
// First we create a canvas to draw our pattern on
// Doesn't actually have to be in the DOM
var offscreenCanvas = document.createElement('canvas');
offscreenCanvas.width = textureWidth;
offscreenCanvas.height = textureHeight;
// Grab it's context and render to it
var offscreenContext = offscreenCanvas.getContext('2d');
texture, // the Image
sourceX, // X offset on the spritesheet
sourceY, // Y offset on the spritesheet
textureWidth, // Width of the sprite
textureHeight, // Height of the sprite
0, // Destination X
0, // Destination Y
textureWidth, // Destination width
textureHeight // Destination height
Now here's the fun part: creating a pattern from our "invisible" canvas.
// Can use 'repeat', 'repeat-x', 'repeat-y', or 'no-repeat'
var pattern = context.createPattern(offscreenCanvas, 'repeat');
context.fillStyle = pattern;
context.fillRect(x, y, textureWidth, textureHeight);
As an added bonus, this is much faster than making multiple