WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.36k stars 4.14k forks source link

Plugin Dev Help Debugging White Screen (Editor Fails to Load) / Blank Posts Listing Screen (solved by preventing admin notices associated with my plugins from displaying on the edit page and post listings page) #9585

Closed davidfcarr closed 6 years ago

davidfcarr commented 6 years ago

I have been adding Gutenberg extensions to a couple of related plugins, RSVPMaker and RSVPMaker for Toastmasters, and am seeing the benefits. However, I am currently wrestling with an intermittent bug that occurs only in a few circumstances but is proving very difficult to debug. I have seen some other posts about "white screen" problems, and I'm hoping someone who reads this will have seen something similar and will clue me in on what to look for.

The most puzzling thing is that on a multisite install, the error occurs on some subdomains but not others -- with no obvious configuration differences between them. To my great frustration, it works perfectly on a subdomain used for demo purposes but not on the subdomain I'm using in production.

In these cases:

How it is supposed to work - demo.toastmost.org editor view

gut_demo_editor

How it is supposed to work - demo.toastmost.org event post listing

gut_demo_listing

Error on op.toastmost.org - editor

gut_op_editor

Error on op.toastmost.org - events post listing

gut_op_listing

Console log for events post listing screen (key might be Uncaught TypeError: Cannot read property 'hasClass' of undefined)

load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:305 
Uncaught TypeError: Cannot read property 'hasClass' of undefined 
    at HTMLDocument.<anonymous> (load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:305)
    at HTMLDocument.dispatch (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3)
    at HTMLDocument.r.handle (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3)
    at Object.trigger (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3)
    at Object.a.event.trigger (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:9)
    at HTMLDocument.<anonymous> (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3)
    at Function.each (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2)
    at a.fn.init.each (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2)
    at a.fn.init.trigger (load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3)
    at Object.<anonymous> (load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63)
(anonymous) @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:305
dispatch @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
r.handle @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
trigger @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
a.event.trigger @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:9
(anonymous) @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
each @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2
each @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2
trigger @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
(anonymous) @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
i @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2
fireWith @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:2
y @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
c @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
XMLHttpRequest.send (async)
(anonymous) @ VM31003:1
send @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
ajax @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
j @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
k @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
m @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
n @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
(anonymous) @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
dispatch @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
r.handle @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
VM31003:1 XHR finished loading: POST "https://op.toastmost.org/wp-admin/admin-ajax.php".
(anonymous) @ VM31003:1
send @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
ajax @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:4
j @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
k @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
m @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
n @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
(anonymous) @ load-scripts.php?c=1&load[]=hoverIntent,common,admin-bar,jquery-ui-widget,jquery-ui-position,wp-pointer,jquery-ui-core,jquery-ui-menu,wp-a11y,jquery-ui-auto&load[]=complete,tags-suggest,inline-edit-post,heartbeat,svg-painter,wp-auth-check&ver=4.9.8:63
dispatch @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3
r.handle @ load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils&ver=4.9.8:3

Console log for editor screen (no obvious error)

Navigated to https://op.toastmost.org/wp-admin/post.php?post=1100&action=edit
load-scripts.php?c=1&load[]=jquery-core,jquery-migrate,utils,moxiejs,plupload&ver=4.9.8:9 JQMIGRATE: Migrate is installed, version 1.4.1
index.js?ver=1535740567:1 value prop in color objects passed by withColors HOC is deprecated and will be removed from Gutenberg in 3.9. Please use `color` prop passed in the object instead. Note: This is a global warning, shown regardless of whether value prop is used.
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
VM1783:1 Fetch finished loading: GET "https://op.toastmost.org/wp-json/wp/v2/users/?who=authors&per_page=-1".
(anonymous) @ VM1783:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
b @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
S @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
_invoke @ index.js?ver=1535740567:1
u.next @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
Id @ react-dom.min.82e21c65.js:138
kc @ react-dom.min.82e21c65.js:138
Sa.render @ react-dom.min.82e21c65.js:194
(anonymous) @ react-dom.min.82e21c65.js:141
Hd @ react-dom.min.82e21c65.js:136
mc @ react-dom.min.82e21c65.js:141
render @ react-dom.min.82e21c65.js:196
Fn @ index.js?ver=1535740567:12
(anonymous) @ post.php?post=1100&action=edit:1855
VM1783:1 Fetch finished loading: GET "https://op.toastmost.org/wp-json/wp/v2/rsvpmaker-type?per_page=-1&orderby=count&order=desc&_fields=id%2Cname%2Cparent".
(anonymous) @ VM1783:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
b @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
S @ index.js?ver=1535740567:1
value @ index.js?ver=1535740567:12
value @ index.js?ver=1535740567:12
jc @ react-dom.min.82e21c65.js:134
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
Id @ react-dom.min.82e21c65.js:138
kc @ react-dom.min.82e21c65.js:138
Sa.render @ react-dom.min.82e21c65.js:194
(anonymous) @ react-dom.min.82e21c65.js:141
Hd @ react-dom.min.82e21c65.js:136
mc @ react-dom.min.82e21c65.js:141
render @ react-dom.min.82e21c65.js:196
Fn @ index.js?ver=1535740567:12
(anonymous) @ post.php?post=1100&action=edit:1855
VM1783:1 Fetch finished loading: GET "https://op.toastmost.org/wp-json/wp/v2/taxonomies/rsvpmaker-type?context=edit".
(anonymous) @ VM1783:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
b @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
S @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
Promise.then (async)
r @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
Promise.then (async)
r @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
_invoke @ index.js?ver=1535740567:1
u.next @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
Id @ react-dom.min.82e21c65.js:138
kc @ react-dom.min.82e21c65.js:138
Sa.render @ react-dom.min.82e21c65.js:194
(anonymous) @ react-dom.min.82e21c65.js:141
Hd @ react-dom.min.82e21c65.js:136
mc @ react-dom.min.82e21c65.js:141
render @ react-dom.min.82e21c65.js:196
Fn @ index.js?ver=1535740567:12
(anonymous) @ post.php?post=1100&action=edit:1855
VM1783:1 Fetch finished loading: GET "https://op.toastmost.org/wp-json/wp/v2/rsvpmaker-type?per_page=-1&orderby=count&order=desc&_fields=id%2Cname%2Cparent".
(anonymous) @ VM1783:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
b @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
m @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t @ index.js?ver=1535740567:1
S @ index.js?ver=1535740567:1
value @ index.js?ver=1535740567:12
value @ index.js?ver=1535740567:12
jc @ react-dom.min.82e21c65.js:134
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
enqueueSetState @ react-dom.min.82e21c65.js:189
q.setState @ react.min.ab6b06d4.js:18
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
d @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
w @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
t.(anonymous function) @ index.js?ver=1535740567:1
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
Promise.then (async)
o @ index.js?ver=1535740567:1
c @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
n @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
p @ index.js?ver=1535740567:1
f @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:1
(anonymous) @ index.js?ver=1535740567:12
e @ index.js?ver=1535740567:1
r @ index.js?ver=1535740567:1
yh @ react-dom.min.82e21c65.js:97
lg @ react-dom.min.82e21c65.js:120
mg @ react-dom.min.82e21c65.js:120
gc @ react-dom.min.82e21c65.js:127
vb @ react-dom.min.82e21c65.js:126
ub @ react-dom.min.82e21c65.js:126
zd @ react-dom.min.82e21c65.js:124
ra @ react-dom.min.82e21c65.js:123
Id @ react-dom.min.82e21c65.js:138
kc @ react-dom.min.82e21c65.js:138
Sa.render @ react-dom.min.82e21c65.js:194
(anonymous) @ react-dom.min.82e21c65.js:141
Hd @ react-dom.min.82e21c65.js:136
mc @ react-dom.min.82e21c65.js:141
render @ react-dom.min.82e21c65.js:196
Fn @ index.js?ver=1535740567:12
(anonymous) @ post.php?post=1100&action=edit:1855

Sample block content

<!-- wp:wp4toastmasters/agendanoterich2 {"time_allowed":"1","uid":"note10870"} -->
<p class="wp-block-wp4toastmasters-agendanoterich2">Sgt of Arms opens the meeting.</p>
<!-- /wp:wp4toastmasters/agendanoterich2 -->

<!-- wp:wp4toastmasters/role {"role":"custom","custom_role":"Jokester"} /-->

<!-- wp:wp4toastmasters/agendanoterich2 {"time_allowed":"1","uid":"note14455"} -->
<p class="wp-block-wp4toastmasters-agendanoterich2">President or Presiding Officer introduces the Toastmaster of the Day</p>
<!-- /wp:wp4toastmasters/agendanoterich2 -->

<!-- wp:wp4toastmasters/role {"role":"Toastmaster of the Day","count":"1","agenda_note":"Introduces supporting roles. Leads the meeting.","time_allowed":"3","padding_time":"0"} /-->

<!-- wp:wp4toastmasters/role {"role":"Ah Counter","count":"1","time_allowed":"0","padding_time":"0"} /-->

Block definitions

/**
 * BLOCK: wpt
 *
 * Registering a basic block with Gutenberg.
 * Simple block, renders and saves the same content without any interactivity.
 */

//  Import CSS.
import './style.scss';
import './editor.scss';

const { __ } = wp.i18n; // Import __() from wp.i18n
const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks
const { RichText } = wp.editor;

/**
 * Register: aa Gutenberg Block.
 *
 * Registers a new block provided a unique name and an object defining its
 * behavior. Once registered, the block is made editor as an option to any
 * editor interface where blocks are implemented.
 *
 * @link https://wordpress.org/gutenberg/handbook/block-api/
 * @param  {string}   name     Block name.
 * @param  {Object}   settings Block settings.
 * @return {?WPBlock}          The block, if it has been successfully
 *                             registered; otherwise `undefined`.
 */

registerBlockType( 'wp4toastmasters/agendanoterich2', {
    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
    title: __( 'Toastmasters Agenda Note' ), // Block title.
    icon: 'admin-comments', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
    keywords: [
        __( 'Toastmasters' ),
        __( 'Agenda' ),
        __( 'Rich Text' ),
    ],
attributes: {
        content: {
            type: 'array',
            source: 'children',
            selector: 'p',
        },
        time_allowed: {
            type: 'string',
            default: '',
        },
        uid: {
            type: 'string',
            default: '',
        },
    },

    edit: function( props ) {   

    const { attributes, attributes: { time_allowed }, className, setAttributes, isSelected } = props;
    var uid = props.attributes.uid;
    if(!uid)
        {
            var date = new Date();
            uid = 'note' + date.getTime();
            setAttributes({uid});
        }

    function setTime( event ) {
        const selected = event.target.querySelector( '#time_allowed option:checked' );
        setAttributes( { time_allowed: selected.value } );
        event.preventDefault();
    }       

    return (<div className={ props.className }>
<form onSubmit={ setTime } ><strong>Toastmasters Agenda Note</strong> <select id="time_allowed"  value={ time_allowed } onChange={ setTime }>
<option value="">Minutes Allowed (optional)</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">59</option>
</select></form>
<RichText
    tagName="p"
    value={attributes.content}
    multiline=' '
    onChange={(content) => setAttributes({ content })}
/></div>);

    },
    save: function( { attributes, className } ) {
        //return null;
        return <RichText.Content tagName="p" value={ attributes.content } className={className} />;
    }
});

registerBlockType( 'wp4toastmasters/signupnote', {
    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
    title: __( 'Toastmasters Signup Form Note' ), // Block title.
    icon: 'admin-comments', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
    keywords: [
        __( 'Toastmasters' ),
        __( 'Signup' ),
        __( 'Rich Text' ),
    ],
attributes: {
        content: {
            type: 'array',
            source: 'children',
            selector: 'p',
        },
    },

    edit: function( props ) {   
    const { attributes, setAttributes } = props;

    return (<div className={ props.className }>
                <strong>Toastmasters Signup Form Note</strong><RichText
                tagName="p"
                className={props.className}
                value={props.attributes.content}
                onChange={(content) => setAttributes({ content })}
            />
            </div>
);

    },
    save: function(props) {

    return <RichText.Content tagName="p" value={ props.attributes.content } className={props.className} />;
    }

} );

registerBlockType( 'wp4toastmasters/role', {
    // Role [toastmaster role="Toastmaster of the Day" count="1" agenda_note="Introduces supporting roles. Leads the meeting." time="" time_allowed="2" padding_time="0" ]

    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
    title: __( 'Toastmasters Agenda Role' ), // Block title.
    icon: 'groups', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
    keywords: [
        __( 'Toastmasters' ),
        __( 'Agenda' ),
        __( 'Role' ),
    ],
attributes: {
        role: {
            type: 'string',
            default: '',
        },
        custom_role: {
            type: 'string',
            default: '',
        },
        count: {
            type: 'int',
            default: 1,
        },
        agenda_note: {
            type: 'string',
            default: '',
        },
        time_allowed: {
            type: 'string',
            default: '',
        },
        padding_time: {
            type: 'string',
            default: '',
        },
    },
    edit: function( props ) {

    const { attributes: { role, custom_role, count, agenda_note, time_allowed, padding_time }, setAttributes, isSelected } = props;

    function showHideOptions () {
        const selected = document.querySelector( '#role option:checked' );
        if(selected.value == 'custom')
            customline.style = 'display: block;';
        else
            {
            document.getElementById('custom_role').value = '';
            customline.style = 'display: none;';
            }
        var paddingline = document.getElementById('paddingline');

        if(selected.value == 'Speaker')
            paddingline.style = 'display: block;';
        else
            {
            paddingline.style = 'display: none;';
            }
    }

    function setRole() {
        const selected = event.target.querySelector( '#role option:checked' );
        setAttributes( { role: selected.value } );
        var customline = document.getElementById('customline');
        showHideOptions();

        event.preventDefault();
        }
    function setTime( event ) {
        const selected = event.target.querySelector( '#time_allowed option:checked' );
        setAttributes( { time_allowed: selected.value } );
        event.preventDefault();
    }   
    function setCustomRole( event ) {
        var roleinput = document.getElementById('custom_role').value;
        setAttributes( { custom_role: roleinput } );
        event.preventDefault();
    }
    function setCount( event ) {
        const selected = event.target.querySelector( '#count option:checked' );
        setAttributes( { count: selected.value } );
        event.preventDefault();
    }   
    function setAgendaNote( event ) {
        var note = document.getElementById('agenda_note').value;
        setAttributes( { agenda_note: note } );
        event.preventDefault();
    }   
    function setPaddingTime( event ) {
        const selected = event.target.querySelector( '#padding_time option:checked' );
        setAttributes( { padding_time: selected.value } );
        event.preventDefault();
    }

    function showPaddingTime () {

        return (<div id="paddingline">
            <label>Padding Time:</label> <select id="padding_time"  value={ padding_time } onChange={ setPaddingTime }>
                        <option value="">Minutes Allowed (optional)</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<br /><em>Typical use: extra time for introductions, beyond the time allowed for speeches</em>
</div>);
    }

        function showForm() {
        if(!isSelected)
            return (<em> Click to show options</em>);
return (<form onSubmit={ setRole, setCustomRole, setCount, setTime, setPaddingTime, setAgendaNote } >
<div><label>Role:</label> 
<select id="role" value={ role } onChange={ setRole }>
<option value=""></option>
<option value="custom">Custom Role</option>
<option value="Ah Counter">Ah Counter</option>
<option value="Body Language Monitor">Body Language Monitor</option>
<option value="Evaluator">Evaluator</option>
<option value="General Evaluator">General Evaluator</option>
<option value="Grammarian">Grammarian</option>
<option value="Humorist">Humorist</option>
<option value="Speaker">Speaker</option>
<option value="Topics Master">Topics Master</option>
<option value="Table Topics">Table Topics</option>
<option value="Timer">Timer</option>
<option value="Toastmaster of the Day">Toastmaster of the Day</option>
<option value="Vote Counter">Vote Counter</option>
<option value="Contest Chair">Contest Chair</option>
<option value="Contest Master">Contest Master</option>
<option value="Chief Judge">Chief Judge</option>
<option value="Ballot Counter">Ballot Counter</option>
<option value="Contestant">Contestant</option>
</select>           
</div>
<p id="customline"><label>Custom Role:</label> <input type="text" id="custom_role" onChange={setCustomRole} defaultValue={custom_role} /></p>
<div>           <label>Count:</label> <select id="count"  value={ count } onChange={ setCount }>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
</select>
</div>

<div>           <label>Time Allowed:</label> <select id="time_allowed"  value={ time_allowed } onChange={ setTime }>
                        <option value="">Minutes Allowed (optional)</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
<option value="37">37</option>
<option value="38">38</option>
<option value="39">39</option>
<option value="40">40</option>
<option value="41">41</option>
<option value="42">42</option>
<option value="43">43</option>
<option value="44">44</option>
<option value="45">45</option>
<option value="46">46</option>
<option value="47">47</option>
<option value="48">48</option>
<option value="49">49</option>
<option value="50">50</option>
<option value="51">51</option>
<option value="52">52</option>
<option value="53">53</option>
<option value="54">54</option>
<option value="55">55</option>
<option value="56">56</option>
<option value="57">57</option>
<option value="58">58</option>
<option value="59">59</option>
<option value="60">59</option>
</select>
<br /><em>Total time allowed. If you have three speakers, you might allow 24 minutes or more to allow for two 7-minute speeches, plus a slightly longer one.</em>
</div>
{showPaddingTime()}
<p><label>Agenda Note:</label> <input type="text" id="agenda_note" onChange={setAgendaNote} defaultValue={agenda_note} /></p>

</form>);       
        }

        return (
<div className={ props.className }>
<strong>Toastmasters Role {role} {custom_role}</strong>
{ showForm() }
</div>
        );
    },
    save: function (props) { return null; },

} );

registerBlockType( 'wp4toastmasters/agendaedit', {

    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
    title: __( 'Toastmasters Editable Note' ), // Block title.
    icon: 'welcome-write-blog', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
    keywords: [
        __( 'Toastmasters' ),
        __( 'Agenda' ),
        __( 'Editable' ),
    ],
attributes: {
        editable: {
            type: 'string',
            default: '',
        },
        uid: {
            type: 'string',
            default: '',
        },  
    },
    edit: function( props ) {

    const { attributes: { editable }, setAttributes, isSelected } = props;

    var uid = props.attributes.uid;
    if(!uid)
        {
            if(editable)
                uid = editable;
            else
                {
                var date = new Date();
                uid = 'editable' + date.getTime();                  
                }
            setAttributes({uid});
        }

    function setAgendaEdit( event ) {
        var note = document.getElementById('editable').value;
        setAttributes( { editable: note } );
        event.preventDefault();
    }   
    function showForm() {
    if(!isSelected)
        return (<p><em>Select to set title</em></p>);
return (<form onSubmit={ setAgendaEdit } >
<p><label>Editable Note Title:</label> <input type="text" id="editable" onChange={setAgendaEdit} defaultValue={editable} /></p>
<p>Enter the title for a note that can be changed for each meeting the meeting. <em>Example: Meeting Theme.</em></p></form>);       
        }

        return (
<div className={ props.className }>
<p class="dashicons-before dashicons-welcome-write-blog"><strong>Toastmasters Editable Note</strong></p>
{ showForm() }
</div>
        );
    },
    save: function (props) { return null; },

} ); 

registerBlockType( 'wp4toastmasters/absences', {
    // Block name. Block names must be string that contains a namespace prefix. Example: my-plugin/my-custom-block.
    title: __( 'Toastmasters Absences' ), // Block title.
    icon: 'admin-comments', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
    category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
    keywords: [
        __( 'Toastmasters' ),
        __( 'Agenda' ),
        __( 'Absences' ),
    ],
    attributes: {
       show_on_agenda: {
            type: 'int',
            default: 0,
        },
    },
    edit: function( props ) {   
    const { attributes: { show_on_agenda }, setAttributes, isSelected } = props;

    function setShowOnAgenda() {
        const selected = event.target.querySelector( '#show_on_agenda option:checked' );
        setAttributes( { show_on_agenda: selected.value } );
        event.preventDefault();     
    }
    function showForm() {
return (<form onSubmit={ setShowOnAgenda } >
<label>Show on Agenda?</label> <select id="show_on_agenda" value={ show_on_agenda } onChange={ setShowOnAgenda }>
<option value="0">No</option>
<option value="1">Yes</option>
</select></form>);      
        }

    return (<div className={ props.className }>
                <strong>Toastmasters Absences</strong> placeholder for widget that tracks planned absences
            {showForm()}
            </div>
);

    },
    save: function(props) {
    return null;
    }
} ); 
davidfcarr commented 6 years ago

Through long process of elimination, I found that the issue went away if I prevented admin notices associated with my plugins from displaying on the edit page and post listings page. Even though you don't see notices displayed on the edit page when Gutenberg is active, they are still there, just hidden. Exactly what in that code was causing problems, I'm still not sure. Because of the way Gutenberg enforces strict validation of the DOM, it could just be a bit of sloppy HTML.

FWIW, here is what I added to the top of my admin notices block:

function rsvpmaker_admin_notice() {
if(isset($_GET['action']) && ($_GET['action'] == 'edit'))
    return; //don't clutter edit page with admin notices. Gutenberg hides them anyway.
if(isset($_GET['post_type']) && ($_GET['post_type'] == 'rsvpmaker') && !isset($_GET['page']))
    return; //don't clutter post listing page with admin notices