Canvas: Easy means to grab a clean list of module pages?

[gwied]

In Canvas, I need an easy way to grab/copy a clean list of module pages to copy/paste into other documents. The only way I have found so far is:
1. Temporarily create a module progress (list format) bar/element at the beginning of each module,
2. manually select the page titles and copy (drag mouse to select),
3. paste into desired destination Word/Excel/text doc,
4. Finally, re-edit the page to delete the temporary module progress element.

OR,
1. screenshot of the Pages of one Module, in Modules view
2 .OCR the screenshot
3 .Copy the OCR'd text
4 .paste into text editor,
5. clean up 'gremlins'
6. copy/paste text into desired destination Word/Excel/text doc

What does NOT work: selecting web page text in the Modules view grabs SO MANY other web page elements that it is not worth doing. I have not found anywhere else in Pages list, TidyUp, Smart Search results, etc., where I can get _clean_ text to copy/paste. I’m even willing to dig through a Canvas course export package (.imscc) if such a list(s) is available there.

Thank you!

[Gabriel33]

What do you mean by "module pages"? Either way, you may be able to do it with a bit of coding. Should be much easier than going through the .imscc.

If you just want the module titles, given what you have already tried, you may want to use the API. To the end of your default Canvas instance, add api/v1/courses/[courseID]/modules, that returns a JSON with the modules, including their names.

If you want the names of the pages in the modules, which seems more likely, then that API still works, but you may need some coding. In particular, it returns an "items_url" which gives you a JSON with the items for each module.

[gwied]

I'm not a Canvas admin, just a designer. In short, this is too much work for my level of involvement. I'll continue the slow/messy methods in the OP.

I tried [Canvas instance]/api/v1/courses/[courseID]/modules 
which gave me a block of code including the following for every module in the course:

...,{"id":854296,"name":"[ModuleTitle]","position":8,"unlock_at":null,"require_sequential_progress":false,"requirement_type":"all","publish_final_grade":false,"prerequisite_module_ids":[],"published":true,"items_count":7,"items_url":"https://canvas.iastate.edu/api/v1/courses/[courseID]/modules/[moduleCode]/items"},...

So with a lot of clever search+replace regex, I could obtain a list of modules.

Then for EACH module, I used the URL following "items_url" to obtain a similarly complex block of code for the items in a module - e.g.,

https://canvas.[defaultInstance]/api/v1/courses/[courseID]/modules/[moduleCode]/items
... which yields as similarly complex block of code, requiring more clever search+replace functions in a text processor.
It might be worth figuring out the search+replace strings if I had to do it hundreds of times, but not if I have to do it only 10-20 times.

[Gabriel33]

I asked ChatGPT to automate that a bit, without leaving the browser (I tested it on Firefox):

1. Go to a Canvas page, right click, choose Inspect.
2. At the bottom of the "Inspector" tab, paste the following code (change the 12345 into your course ID):
   
   Spoiler

   const courseId = 12345;
   
   fetch(`/api/v1/courses/${courseId}/modules`)
     .then(r => r.json())
     .then(mods => Promise.all(
       mods.map(m =>
         fetch(m.items_url)
           .then(r => r.json())
           .then(items => items.map(it => ({
             module: m.name,
             title: it.title,
             type: it.type
           })))
       )
     ))
     .then(results => {
       // flatten nested arrays
       const flat = results.flat();
       console.table(flat);
     });
   

3. Press enter, and it will generate a table of the modules and each item in the modules

[gwied]

I'm using Firefox. in the bottom of the inspector tab, I cannot enter anything. Am I missing some kind of access privilege? (screenshot)

[Gabriel33 · Accepted solution]

Sorry, you should paste it in the Console.

The console is a separate tab to the inspector, but it's also possible to make it show up at the bottom of the other tabs (which was my case), by pressing "Esc" while in those tabs.

[gwied]

To paste the code in the Console, I had to type "allow pasting" after a couple of warnings in Firefox (Did not get past warnings in Chrome - more patience? a different path?) The Console then generated a very clear, concise table 😁 which will be easy to further manipulate/format etc in Excel. 

Now THIS is something I can repeat to obtain the exact info I need efficiently!
Thank you, @Gabriel33  

[Gabriel33]

Right, Firefox understands that pasting random code from the internet is dangerous.

I tried making the code do the least possible, and I think it is still easy to see that the current code is really just making that table (and not sending all your passwords to me).
But it shouldn't be too hard to (with your LLM of choice) remove rows that you don't need, or to save it directly as CSV instead of showing the table.

[gwied]

@Gabriel33 After one success, I could not replicate my success in another course 😕

Here are the steps I followed, as discovered from our previous exchange:

Using FIREFOX browser

1. Go to a Canvas - Modules page, right click, choose Inspect.
2. Find/open the Console tab, a separate tab from the Inspector, but it's also possible to make it show up at the bottom of the other tabs by pressing "Esc" while in those tabs.
3. for clarity, clear the Console using "location.reload()"
3. manually type "allow pasting"
5. paste the code block [posted under "spoiler" above] (change the 12345 into your course ID):
6. Press enter, and it will generate a table of the modules and each item in the modules

Problem: code executes, yielding no result that I can see (screenshot of Console code after pressing "enter")

After 15 min, it looks like there is an endless nesting of 

<prototype>: Object { ... }

Can you guess where I went wrong? 
Is there something strange about this Canvas course that prevented the code from outputting the table?

Thanks for your skills!