UDOIT Information

[tr_jbates]

What is UDOIT?

The Universal Design Online content Inspection Tool, or UDOIT (pronounced, “You Do It”) enables faculty to identify accessibility issues in their Canvas course content. It will scan a course, generate a report, and provide resources on how to address common accessibility issues.  It was originally created by the Center for Distributed Learning (CDL) at the University of Central Florida (CDL), and has received significant contributions from many organizations, especially Cidi Labs.

What does it do?

UDOIT will identify “errors” and provide “suggestions” in the following areas of your course:

• Announcements
• Assignments
• Discussions
• Files (i.e., .html files)
• Pages
• Syllabus
• Module URLs

It will check for many different accessibility issues, including:

• Use of headings in page structure
• Alternative text for images
• Table headers
• Color contrast
• Descriptive link text
• Video captions

Please note: some items cannot be examined by UDOIT. These include external documents and some videos/audio files for captioning/transcripts.

More Information

Instructors:

• If your institution is already using UDOIT with Canvas, it can be enabled via your Canvas course settings.
• For more information about UDOIT, visit our UDOIT information page.

Developers/LMS Admins/IT Staff:

If you are interested in downloading and installing UDOIT, visit the GitHub project.  If you would like to join the community of other users and developers, please join the UCF Open Source Slack organization.

[tr_jbates]

What version of UDOIT are you using?  I just tested that code in 2.3.5 and 2.5.0 and it correctly finds the TH tags and ignores the table.

[dhelms802]

It appears we are running 2.3.1.

Our IT Department is currently updating our instance of UDOIT.

Thanks for the information.

Respectfully,

Del Helms

Mt. San Jacinto College

Distance Education Activity Coordinator

Phone: (951) 639-5448 (it is us much better to e-mail me)

E-mail: dhelms@msjc.edu<mailto:dhelms@msjc.edu>

Virtual Office: https://cccconfer.zoom.us/j/9516395448

[tvanderkolk]

Greetings everyone,

I have been trying to set up UDOIT in our test Canvas environment with a deployment on the Heroku server using these instructions (UDOIT/HEROKU.md at master · ucfopen/UDOIT · GitHub).  UDOIT is listed in the course navigation and I get to the point of clicking the Authorize button.  When I do so, I get an  Authentication problem: Please contact support message.  I have checked the settings on both sides and also tried a clean deployment.  Any tips out there to help me figure out what's (not) going on?

Thanks,

Tim  

[tvanderkolk]

Follow up.  It works when I'm using Firefox, but throwing the authentication message while using Chrome.  Good and bad I guess.  At least we are able to start poking around using Firefox.  If there is something specific to Chrome that I need to check, please let me know.

[tr_jbates]

That message appears at the end of the Oauth2 process, and happens because the response from Canvas contains an error message (on Line 40 of oauth2response.php).  If it works in Firefox, but not in Chrome, try clearing your cache and cookies in Chrome to see if that clears it up.  If that doesn't work, go into your user settings in Canvas and remove the authorization from UDOIT.  If it still doesn't work, go to the Admin Panel for UDOIT and deauthorize your user.

[tvanderkolk]

Hi Jacob,

Thanks for the information.  Others in my organization have been able to use Chrome, so it is something with me.  I seem to be the only one with the issue.  Easy enough to work around.

Thanks,

Tim

[cthanoms]

I have been having a problem figuring out how to properly fixing the table header error. I used U FIX IT! button and nothing changed. It keeps showing the same error. I copied example codes below.  Am I missing anything? Any suggestion how to fix the HTML table below so UDOIT would not throw "table header" error. Thank you in advance.

Error: "Add a table header because it provides a description of the table structure for sighted"

UDOIT: v.2.5.0

HTML Codes:

<table style="border-collapse: collapse; width: 100%;" border="1"> <thead> <tr> <th scope="col">Letter Grade</th> <th scope="col">Percentage</th> <th scope="col">Points</th> </tr> </thead> <tbody> <tr> <td>A</td> <td>90%</td> <td>450</td> </tr> <tr> <td>B</td> <td>85%</td> <td>425</td> </tr> </tbody> </table>

[tr_jbates]

I tested this in 2.5.0 and was not able to replicate the issue.  I copied the HTML you provided into my test course, and the table did not show up as an error in the UDOIT report.  Is there any other code around the table that could be affecting the scan?

[dhelms802]

Our version of UDOIT 2.5 flags tables consistently as "No table headers found".  See example below:

Line 106: <table class="ic-Table ic-Table--hover-row"> <caption>Assignments and Points Possible</caption> <thead> <tr align="left" valign="top"> <th class="special_text" scope="col" width="85%">Assignment</th> <th style="text-align: right;" scope="col"> <div> <div>Point Values</div> </div> </th> </tr> </thead> <tbody> <tr align="left" valign="top"> <td class="special_text" width="85%">Initial Check-In Discussion</td> <td class="special_text" style="text-align: right;"> <div>10 points</div> </td> </tr> <tr align="left" valign="top"> <td class="special_text" width="85%">Introduction to Canvas Quiz (10 pts.) and Unit Quizzes (5 pts. each)</td> <td class="special_text" style="text-align: right;">70 points</td> </tr> <tr align="left" valign="top"> <td class="special_text">*Section Test Scores</td> <td class="special_text" style="text-align: right;" align="right"> <div>250 points</div> </td> </tr> <tr align="left" valign="top"> <td class="special_text">Diet Diary Analysis</td> <td class="special_text" style="text-align: right;" align="right"> <div>100 points</div> </td> </tr> <tr align="left" valign="top"> <td class="special_text">*In Class Assignments</td> <td class="special_text" style="text-align: right;"> <div>50 points</div> </td> </tr> <tr align="left" valign="top"> <td class="special_text">*Assignments</td> <td class="special_text" style="text-align: right;"> <div>100 points</div> </td> </tr> <tr align="left" valign="top"> <td class="special_text" width="85%">Total Points Possible</td> <td class="special_text" style="text-align: right;"> <div>580 points</div> </td> </tr> </tbody> </table>

After choosing U Fix It and applying Both first row and first column this is what the code looks like:

<table class="ic-Table ic-Table--hover-row"><caption>Assignments and Points Possible</caption>
<thead>
<tr align="left" valign="top">
<th class="special_text" scope="col" width="85%">Assignment</th>
<th style="text-align: right;" scope="col">
<div>
<div>Point Values</div>
</div>
</th>
</tr>
</thead>
<tbody>
<tr align="left" valign="top">
<td class="special_text" width="85%">Initial Check-In Discussion</td>
<td class="special_text" style="text-align: right;">
<div>10 points</div>
</td>
</tr>
<tr align="left" valign="top">
<td class="special_text" width="85%">Introduction to Canvas Quiz (10 pts.) and Unit Quizzes (5 pts. each)</td>
<td class="special_text" style="text-align: right;">70 points</td>
</tr>
<tr align="left" valign="top">
<td class="special_text">*Section Test Scores</td>
<td class="special_text" style="text-align: right;" align="right">
<div>250 points</div>
</td>
</tr>
<tr align="left" valign="top">
<td class="special_text">Diet Diary Analysis</td>
<td class="special_text" style="text-align: right;" align="right">
<div>100 points</div>
</td>
</tr>
<tr align="left" valign="top">
<td class="special_text">*In Class Assignments</td>
<td class="special_text" style="text-align: right;">
<div>50 points</div>
</td>
</tr>
<tr align="left" valign="top">
<td class="special_text">*Assignments</td>
<td class="special_text" style="text-align: right;">
<div>100 points</div>
</td>
</tr>
<tr align="left" valign="top">
<td class="special_text" width="85%">Total Points Possible</td>
<td class="special_text" style="text-align: right;">
<div>580 points</div>
</td>
</tr>
</tbody>
</table>

When I run the report, it indicates the same, exact errors.

Respectfully,

Del Helms

[tr_jbates]

Interesting.  I just tried that on my instance of 2.5.0, and it didn't flag your example HTML as an error.  Does it do this to every table?

[cthanoms]

Thank you for testing. No, that is the only one table.  First, when I ran an entire course, I saw that it flagged every table that I have. In an attempt to identify the issue, i created one table (example) in one empty page and only ran UDOIT on that page.

[fathaulg]

It  may be struggling with having the TH in the THEAD element... I've seen that before.

Laura

[cthanoms]

I also tried the example html (without thead) from "What accessibility issues does UDOIT look for?" page. Unfortunately, the same error was still flagged.

I might have to just ignore it for now. 

[dhelms802]

Unfortunately, that has become the standard reply that tables aren't flagged when checked on systems running UDOIT 2.5.0.  We updated our instance of UDOIT to 2.5.0 and we are still getting the same table errors across multiple courses.  This is extremely challenging and we have deemed the errors as "false positives" because the U FIX IT does not correct the errors and even when we have manually code the tables to include <th scope="col"></th> or <th scope="row"></th>, the tables are still flagged.  We're about to discontinue our use of UDOIT because we can't keep having errors that are not errors being identified.

Respectfully,

Del Helms

[fathaulg]

Obviously it shouldn't be flagging those as written here. If you add role="columnheader" to the TH elements (redundant role for those elements) does it do the same thing?

[dhelms802]

Laura,

The fix you recommended possibly could work, but it is an impractical resolution as most of our faculty have no idea how to code HTML.

Perhaps an underlying issue is that when one adds a table using the RCE in Canvas, Canvas' own accessibility checker flags the table as not being accessible.  Only when one runs the Canvas accessibility checker and applies its recommended fixes, does the table come back as being accessible.

Figure 1 (Table inserted in Canvas)

<table style="border-collapse: collapse; width: 100%;" border="1">
<tbody>
<tr>
<td style="width: 33.3333%;">Name</td>
<td style="width: 33.3333%;">Age</td>
<td style="width: 33.3333%;">Gender</td>
</tr>
<tr>
<td style="width: 33.3333%;">Steve</td>
<td style="width: 33.3333%;">20</td>
<td style="width: 33.3333%;">Male</td>
</tr>
<tr>
<td style="width: 33.3333%;">Amber</td>
<td style="width: 33.3333%;">19</td>
<td style="width: 33.3333%;">Female</td>
</tr>
</tbody>
</table>

Figure 2 (After accessibility checker with captions and setting a table header for the rows)

<table style="border-collapse: collapse; width: 100%;" border="1"><caption>People</caption>
<tbody>
<tr>
<th style="width: 33.3333%;" scope="col">Name</th>
<th style="width: 33.3333%;" scope="col">Age</th>
<th style="width: 33.3333%;" scope="col">Gender</th>
</tr>
<tr>
<td style="width: 33.3333%;">Steve</td>
<td style="width: 33.3333%;">20</td>
<td style="width: 33.3333%;">Male</td>
</tr>
<tr>
<td style="width: 33.3333%;">Amber</td>
<td style="width: 33.3333%;">19</td>
<td style="width: 33.3333%;">Female</td>
</tr>
</tbody>
</table>

Figure 3 (UDOIT Scan)

Error - No Table Headers Found

Line 1: <table style="border-collapse: collapse; width: 100%;" border="1"> <caption>People</caption> <tbody> <tr> <th style="width: 33.3333%;" scope="col">Name</th> <th style="width: 33.3333%;" scope="col">Age</th> <th style="width: 33.3333%;" scope="col">Gender</th> </tr> <tr> <td style="width: 33.3333%;">Steve</td> <td style="width: 33.3333%;">20</td> <td style="width: 33.3333%;">Male</td> </tr> <tr> <td style="width: 33.3333%;">Amber</td> <td style="width: 33.3333%;">19</td> <td style="width: 33.3333%;">Female</td> </tr> </tbody> </table>

Here is an image of the error

Here is the table after U FIX IT!

<table style="border-collapse: collapse; width: 100%;" border="1"><caption>People</caption>
<tbody>
<tr>
<th style="width: 33.3333%;" scope="col">Name</th>
<th style="width: 33.3333%;" scope="col">Age</th>
<th style="width: 33.3333%;" scope="col">Gender</th>
</tr>
<tr>
<td style="width: 33.3333%;">Steve</td>
<td style="width: 33.3333%;">20</td>
<td style="width: 33.3333%;">Male</td>
</tr>
<tr>
<td style="width: 33.3333%;">Amber</td>
<td style="width: 33.3333%;">19</td>
<td style="width: 33.3333%;">Female</td>
</tr>
</tbody>
</table>

Ran UDOIT again after applying the fix and received the same error message.

Here is a screen shot of our 2.5.0 version of UDOIT

Not sure where the problem lies as I am only a novice HTML user.  It would be nice if this issue got resolved

Respectfully,

Del

[tr_jbates]

I'm doing some more investigating right now.  Do you know if you're running UDOIT on one of your own servers, or are you using Heroku?  If you're using your own server, could you send me the version of PHP it's running?

[dhelms802]

I am requesting the information from our network supervisor and I will be happy to share it when I get it.

Del

[dhelms802]

Jacob,

Our college is hosting UDOIT on our own server and we are running PHP 7.2.

Respectfully,

Del

[tr_jbates]

I'm at a loss at this point without any additional data.  I can't replicate it on my end, which means I'm just making guesses.  Here are the guesses I'm contemplating now:

• Your PHP installation may have a character encoding difference, causing the tables to be interpreted incorrectly.
• Your PHP installation may have a slightly different version of a module that is causing the tables to be interpreted incorrectly.

In order for UDOIT to even initiate the check for table headers, it has to find a table first.  That means that whatever is causing this isn't so severe that it would garble other HTML, just the TH tags.  I'm not even sure if the HTML is being garbled at all.

dhelms802‌ Would you be able to get me in touch with someone who can provide server logs and/or add some log statements to the code to help with debugging?

[cthanoms]

dhelms802 Sorry for responding to your conversation. Hoping to find a solution as well.

tr_jbates‌, we also ran UDOIT internally and the version of PHP is 7.2. I'll see if I can get someone.

[janejump]

tr_jbates‌,

 I've tried to set up an instance of UDOIT in our test environment (I am an admin) and have followed your video and steps on github. I make it to where I click View after deploying the app. This is what I see when I click View.

I can remove the "/safari.fix.php" part of the URL and get something similar to the screen you show in the CanvasLive video (see below)

I've tried this a couple of times and always end up with the same results. Can you recommend some steps to get me back on track?

I really appreciate all your energy in developing this tool and sharing it with the Canvas Community!

[tr_jbates]

Jane,

I see what's going on.  The Safari page is supposed to only show up when you're visiting the app in Canvas using the Safari browser.  Since you were able to get to the "Missing LTI launch information" page by removing the "safari_fix.php" from the URL, you're good to go!  Continue on with the instructions, and let me know if you have any issues.

[janejump]

Hi tr_jbates‌,

Thanks for your reply. I did continue on with the steps and got to where I add the app in Canvas. I copied in the Consumer Key and Shared secret from Heroku then the Config UR, and this is what I got.

I tried installing the app at both the course and the sub-account levels and have received the same error message both times.

Thanks for your patience and time to help resolve this!

[tr_jbates]

I see what's going on.  It looks like the Safari Fix is showing up everywhere now, and is interfering with the udoit.xml.php file.  I'll have to make a new release to fix this.  I'll let you know when it's ready to try again.

[tr_jbates]

Ok, I released a fix for this issue.  It might be easier for you to start over from the Heroku button on the project homepage since the code in your existing installation won't receive the updated code automatically.  Please let me know if you have any issues.

[janejump]

tr_jbates‌, it WORKED!!! Thank you sooo much! I'm so excited to use this incredible tool on our course reviews! Thank you so much for your help and the work you've done on building this tool!!

[michael_ewen]

We've started getting the  Missing Session information. Please refresh the page. Missing: base_url error in Chrome.

Works fine in Firefox. Any ideas?

[tr_jbates]

What version of UDOIT are you using?  You can find the version number in the top-right of the UDOIT banner within the app.

[rmorales3]

I am having the same issue with one of our users. She is getting the same error. We are on version 2.5.0 When I go into the UDOIT Admin the URL is also missing for her User. 

[tr_jbates]

I'm not sure why it would happen to one user, but not to others.  The base_url is sent by Canvas when the LTI is launched.  The reason the URL is missing for that user in the database is because Canvas never provided one.  Is the user using any ad blockers?  Is their account merged with other Canvas instances?  I'm grasping at straws here.

[rmorales3]

I will double check her ad blocker. She got the option to authenticate but it still will not work on Chrome. We have our developer upgrading to 2.6.3, hoping this will resolve the issue.

However, he is running into an issue. From our developer:

   Following the below steps

    Pushing Updates to Heroku

      Now that your computer is set up, you only need to follow these steps each time you would like to update your instance of UDOIT:

1. In your command line interface, navigate to the UDOIT directory on your computer.
2. Run git checkout master to make sure we're on the master branch, which represents the latest version of UDOIT.
3. Run git pull to update your local copy of UDOIT from the official GitHub repository.
4. Run git push heroku master:master to deploy the new version to your UDOIT instance.
5. Run heroku run --app your-heroku-instance "php composer.phar migrate" to update the database structure for your UDOIT instance. (Remember to replace your-heroku-instance with your Heroku instance name.)
6. Log into the Heroku website and click on your UDOIT instance.
7. Click Settings
8. Under the Config Vars heading, click Reveal Config Vars.
9. Compare them to the env section of app.json, and add any missing variables to Heroku.

I was able to get to step 5, but ran into the following error message. 

$ mmorales@ct-test-msapp MINGW64 /c/UDOIT/UDOIT (master)

bash: syntax error near unexpected token `('

'C:\Program' is not recognized as an internal or external command,

operable program or batch file.

[tr_jbates]

I don't have a lot of experience using mingw, so I'm not sure what is causing that issue.  Could you have your developer contact me directly at jacob.bates@ucf.edu?

[marinelli-last1]

Hello I am having a problem with UDOIT using a MacBook.  Let's say a Canvas page has seven errors, I will click on the first one and fix the error with no problem, but then after fixing one or two, when I attempt to fix more errors it won't allow me to submit the change, and will show a red box that says "error" but it won't tell me what the error is.  Then I have to exit UDOIT and scan the course again to continue working on it. Again, I can fix a couple of errors before it stops working and I have to again scan the course. Any fix for this?  Thank you!  Beth]

[scottdennis]

Hi @tr_jbates,

I just wanted to add that as of today, you can use headings here in the community.  😊 

[tr_jbates]

@scottdennis Thanks for following up!  Unfortunately, I'm still not allowed to use headings in this post.  When I try to save the post with headings in place, I am returned to the edit screen, the headings are stripped out, and I receive the following message:  "Your post has been changed because invalid HTML was found in the message body. The invalid HTML has been removed. Please review the message and submit the message when you are satisfied."

[scottdennis]

I have to admit that I kind of had to dig for it.  You have to click the 3 dot icon to expand the RCE toolbar and then you can select it from the Paragraph drop down menu.  Is that not working for you?

[tr_jbates]

@scottdennis The 3 dot icon in the post editor does not include the option to add headings.

[scottdennis]

Hi Again. 😊

This is what I see before I click the three dots:

and then after I click the dots there is a Paragraph drop down with the various heading choices.  Is this different from what you see?

[tr_jbates]

As shown in the screenshot I posted, what I see is different from what you see.  The screenshot I posted is what I see for both commenting and editing this post.

[scottdennis]

How odd...  There must be a setting or permission at work here.  We'll investigate and will update this thread when we know more.  I can't imagine a scenario where you would want some users to be able to use headings and others not but.....

[scottdennis]

Hi @tr_jbates 

Sorry for the inconvenience.  Please try again now.

[tr_jbates]

@scottdennis That worked.  Thank you!

[ashlib]

Hi @tr_jbates, our UDOIT installation is complete, and we're noticing a similar issue with UFIXIT and table headers as mentioned in previous posts. The table has header rows, and when we run the Canvas accessibility checker on the table, it passes. We attempt the fix through UFIXIT, but the error remains the next scan. Has there been any further development on this issue? We're running 2.7.0.

We're also seeing an error message on some courses when we attempt to scan that reads "! UDOIT failed to scan this course." Do you have any advice you might offer on that?

Thanks in advance!

-Ashli

[mtuten]

@tr_jbates and @ashlib We've also noticed that 2.7.0 doesn't scan all courses (or I should say, the report of such scans is only available through View Old Reports).

In one course I own, I was able to unpublish 16 of 47 pages and successfully scan the published pages. I could not find a common denominator between the pages that couldn't be scanned. The person who manages the installation at our institution said that the courses he tried and was unable to scan produced the following error (which I assume he found on the backend) "udoit.ERROR: YouTube API Error: The request cannot be completed because you have exceeded your <a href="/youtube/v3/getting-started#quota">quota</a>." I do not know that the course I experimented with had the same error or not, but several of the pages I couldn't scan didn't have YouTube videos embedded or linked.

[tr_jbates]

@ashlib We're always looking to improve our handling of tables.  Could you send me the HTML of the table UDOIT is having trouble with?  You can send it to jacob.bates@ucf.edu if you don't want to post it here.

@mtuten You may have two separate issues happening.  You should definitely go into your Google API Console and request an increase to your quota.  Also, if you can identify a page that UDOIT is unable to scan, please send me the HTML so I can test.

[VinceDeRusso]

I'm going through the installation directions using Git on an Ubuntu server.  So far, everything was working great.  I'm now at the point of running:

php composer.phar db-setup

When I run that command, I keep getting:

> php bin/run_database_migrations.php
Setting up tables in MySQL
Database Connection error

 I've verified the information in config/localConfig.php is correct, but with still no luck. I even logged into mysql with the same user and password and can create a table no problem.  Any advice here?

[tr_jbates]

@VinceDeRusso Take a look at your config/log.log file.  It should contain a more detailed error message from MySQL.

[Tasha_Biesinger]

@tr_jbates, we recently ran into an issue in a course where UDOIT seems to get stuck while scanning the course. The 'scanning' bar will eventually show "Scanning: pages... (3 left to scan)" but it never completes.

We did quite a bit of testing and believe it is because there are too many issues in the course. Here are the things that lead us to think this:

• The scan succeeded if we excluded pages from the scan
• The scan succeeded if we removed suggestions from the scan options
• The scan succeeded if we removed 'enough' pages from the full course import
• The scan failed after importing 'too many' pages from the original course into an empty course

We were able to see several hundred flagged issues across the many pages in the course as we imported pages in batches and scanned them until we imported too many. We also added and removed pages strategically so that we could rule out the possibility that it was a specific page or group of pages.

Fortunately, there is that button to exclude unpublished content, so we've been able to work around the issue by unpublishing everything, then publishing and scanning pages in batches within the original course.

Is the 'too many issues and UDOIT gets stuck' an issue you've seen before, or is there some configuration we need(ed) to do to avoid this? Another fortunate aspect is we don't have many courses that have hundreds of flagged issues with UDOIT so it is somewhat of an edge case.

It would be great to get your feedback!

[tr_jbates]

@Tasha_Biesinger Thank you so much for the detailed testing report!  I'm almost certain this is a timeout issue with your server.  Are you hosting UDOIT on your own server, or are you using Heroku?  If you are hosting on your own server, you have two options:

1. Increase the "max_execution_time" in PHP.  This method can have a detrimental effect on your server's performance depending on what PHP applications are running on your server.
2. Set up UDOIT to use a background worker.  (To do this, change "$background_worker_enabled = true;" in config/localConfig.php and set up a script to run "php lib/worker.php" whenever your server starts.) This method will allow you to process almost any size course, and you can have multiple threads of "php lib/worker.php" running to process more scans in parallel.