Sample code for Apostrophe CMS which illustrates the 'You were unable to take control of the document'

index.js

module.exports = {
	extend: 'apostrophe-widgets',
	label: 'Double Content',
	skipInitialModal: true, //changed to allow changing of settings of the content via modal
	addFields: [
		{
			name: 'areaLeft',
			type: 'area',
			label: 'Left Area',
			contextual: true // added to remove editing via edit modal
		},
		{
			name: 'areaRight',
			type: 'area',
			label: 'Right Area',
			contextual: true // added to remove editing via edit modal
		}
	]
};

StepsToReproduce.md

I realize that this is a stupid widget, I only made it to illustrate the issue at hand.

1. Add an instance of the Double Content widget to an area.
2. Add an Image to one of the newly instantiated areas. (should work fine)
3. Edit the Double Content widget, saving changes (no actual editing options should be shown)
4. Repeat step 2. (should now tell you You were unable to take control of the document)
5. Cry softly.
6. Refresh page and attempt to add another Image as in Step 2 (should work again, till you try to edit Double Content again.)

widget.html

<div class="two-column">
    <div class="column-left">
        {{ apos.area(data.widget, 'areaLeft', {
            widgets: {
                'apostrophe-images': {}
            }
        }) }}
    </div>
    <div class="column-right">
        {{ apos.area(data.widget, 'areaRight', {
            widgets: {
                'apostrophe-images': {}
            }
        }) }}
    </div>
</div>