[BUG] Shared ColumnDataSource issues in JS callback (Uncaught TypeError: Cannot read property 'connect' of undefined)

ALL software version info (bokeh, python, notebook, OS, browser, any other relevant packages)

Python version      :  3.7.2 (default, Mar 15 2019, 01:06:31) 
IPython version     :  (not installed)
Tornado version     :  6.0.3
Bokeh version       :  1.3.0
BokehJS static path :  /usr/local/lib/python3.7/site-packages/bokeh/server/static
node.js version     :  v10.15.1
npm version         :  6.10.0

OS: Mac OS X Mojave 10.14.6 Browser: Google Chrome Version 76.0.3809.100 (Official Build) (64-bit)

Description of expected behavior and the observed behavior Expected behavior: page should open and a plot containing line and circles should be shown

Observed behavior: a new page opens but no plot is shown. The following JS error is given in JS console in the browser:

Uncaught TypeError: Cannot read property 'connect' of undefined
    at e.t.connect (bokeh-1.3.0.min.js:31)
    at n (bokeh-1.3.0.min.js:31)
    at e.connect_signals (bokeh-1.3.0.min.js:31)
    at e.finalize (bokeh-1.3.0.min.js:31)
    at bokeh-1.3.0.min.js:31
    at i (bokeh-1.3.0.min.js:31)
    at i (bokeh-1.3.0.min.js:31)
    at i (bokeh-1.3.0.min.js:31)
    at i (bokeh-1.3.0.min.js:31)
    at i (bokeh-1.3.0.min.js:31)

Complete, minimal, self-contained example code that reproduces the issue

main.py

from bokeh.plotting import show, figure
from bokeh.models import ColumnDataSource, CustomJS

p = figure()

source = ColumnDataSource(dict(x = [1, 2], y = [2, 1]))
line = p.line('x', 'y', source = source)
circle = p.circle('x', 'y', source = source)

glyphs = [line, circle]
                       
source.selected.js_on_change('indices', 
                             CustomJS(args = {'glyphs': glyphs},  
                                      code = 'console.log("OK")'))                                                            
show(p)

Additional Info

When I replace the code with:

from bokeh.plotting import show, figure
from bokeh.models import ColumnDataSource, CustomJS

p = figure()

line = p.line(x = [1, 2], y = [2, 1])
circle = p.circle(x = [1, 2], y = [2, 1])

glyphs = [line, circle]
                       
glyphs[0].data_source.selected.js_on_change('indices', 
                                            CustomJS(args = {'glyphs': glyphs},  
                                                     code = 'console.log("OK")'))                                                            
glyphs[1].data_source.selected.js_on_change('indices', 
                                            CustomJS(args = {'glyphs': glyphs},  
                                                     code = 'console.log("OK")'))     
show(p)

then everything works fine. Another option is to create a separate source for each glyph (which is not the best solution):

from bokeh.plotting import show, figure
from bokeh.models import ColumnDataSource, CustomJS

p = figure()

source_line = ColumnDataSource(dict(x = [1, 2], y = [2, 1]))
source_circle = ColumnDataSource(dict(x = [1, 2], y = [2, 1]))
line = p.line('x', 'y', source = source_line)
circle = p.circle('x', 'y', source = source_circle)

glyphs = [line, circle]
                       
source_line.selected.js_on_change('indices', 
                                  CustomJS(args = {'glyphs': glyphs},  
                                           code = 'console.log("OK")'))  
source_circle.selected.js_on_change('indices', 
                                  CustomJS(args = {'glyphs': glyphs},  
                                           code = 'console.log("OK")'))                                                          
show(p)

[mattpap]

Do you have any thoughts on the possibility of such cycles?

Not yet. If you can, please submit a PR with your original solution. We can always improve this later.

[p-himik]

This just popped up again at https://discourse.bokeh.org/t/reset-zoom-after-data-source-update-from-bokeh-server/5340/11

I now realize that circular references are definitely possible, and are completely justified. In the example above, ColumnDataSource has CustomJS, which has GlyphRenderer, which has the data source. @mattpap Do you have any thoughts on the possibility of such cycles?