'Python Tutor + Google Colab

Preambula. I'm trying to use Google Colab to teach students Python. The problem is, there is no nice tool to visualize code execution. I tried to use Python Tutor by integrating it with the Google Colab, namely created a "magic command"

from IPython.core.magic import  Magics, magics_class, cell_magic, line_magic

@magics_class
class Helper(Magics):

  def __init__(self, shell=None,  **kwargs):
    super().__init__(shell=shell, **kwargs)

  @cell_magic
  def debug_cell_with_pytutor(self, line, cell):
    import urllib.parse
    url_src = urllib.parse.quote(cell)
    str_begin = '<iframe width="1000" height="500" frameborder="0" src="https://pythontutor.com/iframe-embed.html#code='
    str_end   = '&cumulative=false&py=3&curInstr=0"></iframe>'
    import IPython
    from google.colab import output
    display(IPython.display.HTML(str_begin+url_src+str_end))

get_ipython().register_magics(Helper)

that can be later used as

%%debug_cell_with_pytutor

total_list = []
for i in range(3):
  total_list.append(i)
total_list

The problem. There are actually two problems:

Python Tutor often refuses to process not-so-complicated code like creating a class with few methods. On the other hand, I was able to start Python Tutor locally and it did not fail.
I'm not happy with the fact that two different Pythons are used -- the one in Colab and the one in Python Tutor

What help am I seeking for. I would like to either start Python Tutor in Google Colab, or find any other nice visualization tool that may work in Colab.

Thank you in advance!

UPDATE

At the end of the day I was able to find some solution, but it is quite messy. I'll be glad if anyone proposes something better.

At the moment the code looks like

#@title #Helper functions (debugger)

!curl -O https://raw.githubusercontent.com/fbeilstein/machine_learning/master/pytutor/data_begin.html
!curl -O https://raw.githubusercontent.com/fbeilstein/machine_learning/master/pytutor/data_end.html
!curl -O https://raw.githubusercontent.com/fbeilstein/machine_learning/master/pytutor/pg_encoder.py
!curl -O https://raw.githubusercontent.com/fbeilstein/machine_learning/master/pytutor/pg_logger.py

from IPython.core.magic import  Magics, magics_class, cell_magic, line_magic

@magics_class
class Helper(Magics):

  def __init__(self, shell=None,  **kwargs):
    super().__init__(shell=shell, **kwargs)
    with open('data_begin.html', 'r') as f_in:
      lines = f_in.readlines()
      self.begin_debug = "".join(lines)
    with open('data_end.html', 'r') as f_in:
      lines = f_in.readlines()
      self.end_debug = "".join(lines)

  @cell_magic
  def debug_cell_with_pytutor(self, line, cell):
    import json
    import bdb
    from pg_logger import PGLogger
    import IPython
    from google.colab import output

    def cgi_finalizer(input_code, output_trace):
      ret = dict(code=input_code, trace=output_trace)
      json_output = json.dumps(ret, indent=None) # use indent=None for most compact repr
      display(IPython.display.HTML("<html>" + self.begin_debug + json_output + self.end_debug + "</html>"))


    logger = PGLogger(cumulative_mode=False,
                  heap_primitives=False, 
                  show_only_outputs=False, 
                  finalizer_func=cgi_finalizer,
                  disable_security_checks=True,
                  allow_all_modules=True,
                  probe_exprs=False)

    try:
      logger._runscript(cell)
    except bdb.BdbQuit:
      print("INTERNAL ERROR OCCURED")
    finally:
      logger.finalize()

## use ipython load_ext mechanism here if distributed
get_ipython().register_magics(Helper)

Helper files are stored in my GitHub repository for the ML course. I created them basing on GraphTerm ideas and sources from PyTutor repository. You can find some examples of usage in Lecture two "Python", but there's quite a lot of material, thus it may take some time to find them.

python google-colaboratory

Solution 1:^[1]

Try your existing code (the following part) with %%debug_cell_with_pytutor before it:

from IPython.core.magic import  Magics, magics_class, cell_magic, line_magic

@magics_class
class Helper(Magics):

  def __init__(self, shell=None,  **kwargs):
    super().__init__(shell=shell, **kwargs)

  @cell_magic
  def debug_cell_with_pytutor(self, line, cell):
    import urllib.parse
    url_src = urllib.parse.quote(cell)
    str_begin = '<iframe width="1000" height="500" frameborder="0" src="https://pythontutor.com/iframe-embed.html#code='
    str_end   = '&cumulative=false&py=3&curInstr=0"></iframe>'
    import IPython
    from google.colab import output
    display(IPython.display.HTML(str_begin+url_src+str_end))

get_ipython().register_magics(Helper)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Ryan M

'Python Tutor + Google Colab

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]