Scrawl-canvas v8 - DOM test 012

Add and remove (kill) Scrawl-canvas canvas elements programmatically

This is the <div> element stack which will host the canvas created by Button 1.

Button 2 removes the Button 1 canvas, wherever it is placed on the page.

Clicking Button 3 will delete the stack and, if present, the canvas. After clicking Button 3, creating a canvas with Button 1 will force that canvas to be added to the end of the web page.

Clicking on Button 4 creates a new canvas and adds it randomly to either this normal (not a Scrawl-canvas stack) <div> element, or to the end of the web page.

Test purpose

Turn a DOM element into a Scrawl-canvas stack programmatically
Create a Scrawl-canvas stack and add it to the DOM
Create a Scrawl-canvas stack inside another stack
Dynamically remove and delete a Scrawl-canvas stack from the DOM

Known issue: conversion to stack causes the stack element text to shrink on Android browser - possibly a FOUC problem?

Touch test: not required

Annotated code