This change adds support for typescript transpilation to our frontend
build via babel, and also updates eslint and canvas_i18nliner to be
able to understand typescript as well. The main goal of this PS is to
enable developers to add typescript code to the Canvas codebase but to
be unopinionated about how type-checking is done; at this stage types
will only be checked by running the new `check:ts` or `check:js`
scripts (which run the typescript compiler directly), or via
integration with an IDE like RubyMine or VS Code.
closes LS-2430
flag = none
Test plan:
BUILD STEPS:
- FE build, i18n build, and tests pass Jenkins
- `bin/rails canvas:compile_assets` still works
- `RAILS_ENV=production bin/rails convas:compile_assets` still works
SPOT CHECKING:
- Starting up rails and run `yarn build:js:watch`
- Click around Canvas and make sure the frontend still loads as
normal
Change-Id: I8bb1a0f065e09496a924708dead6fa4518b59496
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/270401
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
Reviewed-by: Nate Armstrong <narmstrong@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Jeff Largent <jeff.largent@instructure.com>
refs FOO-1891
this is the start of a series to break apart the inter-dependencies
between timezone and moment.js
the formatting that is done by moment now stands alone in
packages/date-time-moment-parser and is used by ui/shared/timezone. The
formatter depends on phrases coming from the locale files, which are
available to ui/* but not to packages/*, so in an initializer we inject
our custom formats into the package, allowing it to make use of them.
there should be no breaking API changes, even though several APIs were
dropped, as they were all used in test but not in the app code. To
minimize the changes, a specHelpers.js file is now provided by the
timezone package that maintains backwards compat to a reasonable extent.
TEST PLAN
==== ====
although the tests should be covering this, it wouldn't hurt to manually
exercise any of the date picker widgets
Change-Id: I0c59ad2df8f7392425debb6ec448ec1b4fb029c6
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/265313
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
refs VICE-1683
Test Plan
1. Enable Mentions Flag and Discussion Redesign Flag
2. Open Discussions and open an RCE
3. Type some text and then the @ symbol.
4. Notice, the menu should be positioned under the @ symbol populated
with dummy data names (for now)
Note: There is no filtering, selecting, or simple way to escape at the
moment and will be coming in future reviews.
Change-Id: Icd8fa583004db77313f3fb188933d1a202ef2e0c
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/269684
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Matthew Lemon <mlemon@instructure.com>
QA-Review: Matthew Lemon <mlemon@instructure.com>
Product-Review: Matthew Lemon <mlemon@instructure.com>
Add a badge in a11y button in RCE that checks issues when
user changes its content
closes MAT-211 , MAT-291
flag=rce_a11y_checker_notifications
Test plan 1:
- Navigate to a RCE instance
- Create an a11y issue
Examples:
- Adding a <table> without <th> header tag
- Adding an <img> with a filename extension as alt text
- Add a <h1> with more than 125 characters as content
- Verify that the a11y button's badge increase its value
- Solve a11y issues
- Verify that the a11y button's badge decrease its value(or
dissapear if there is none)
Test plan 2:
- Verify a11y checker verification with large content
(+10 laptop screens) is still running correctly
(it debounces the verification function every 1 second)
Change-Id: Id77ed57005ff26a571f01e5acc5f92be24124669
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/268013
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ed Schiebel <eschiebel@instructure.com>
QA-Review: Ed Schiebel <eschiebel@instructure.com>
Product-Review: David Lyons <lyons@instructure.com>
refs FOO-1116
flag = none
this switches brandable_css from using node-sass as an engine to
dart-sass
breaking changes that we had to accommodate (they are warnings at this
point but obnoxiously noisy):
- https://sass-lang.com/documentation/breaking-changes/slash-div
- https://sass-lang.com/documentation/breaking-changes/color-units
we have to make sure there are no regressions in the styles overall, and
in the issue described in SIS-3125 in particular, since that was the
reason we were stuck on node-sass@4.7.2
== TEST PLAN
- rebuild your assets
- verify there are no visual regressions , good luck
Change-Id: I19bf204df760eb56ad23c14294ef42ec6103c017
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253054
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: August Thornton <august@instructure.com>
QA-Review: August Thornton <august@instructure.com>
Product-Review: August Thornton <august@instructure.com>
refs FOO-1116
right now in order to build the javascript, we must run brandable_css
first for the specific purpose of injecting into handlebars templates
their corresponding stylesheet file with the checksum as reported by
brandable_css
this patch moves things around such that Rails provides this mapping of
"handlebars template" to "CSS variant file checksums" in a global
variable (Rails is privy to this information already), webpack then at
build time injects only a reference to that mapping into the template,
then our runtime brandable-css JS helper will resolve that reference
from the mapping and request the correct file based on the current
user's variant
[1] rails assigns window.BRANDABLE_CSS_HANDLEBARS_INDEX with content
like this:
[
[ "new_styles_normal_contrast", "new_styles_high_contrast", ... ],
{
"0c": ["0f4f01ab86", 0, 0, "e3e7211701", 3, ... ],
...
}
]
the structure of the mapping is explained in brandable_css[1], it is
a bit overtuned to reduce the size as much as possible since this is
included for ALL pages even though the templates in question may never
be rendered (right now it's ~1.5kB and should never grow)
[2] webpack asks @canvas/brandable-css to loadStylesheetForJST using the
contrived id for that file (frontend_build/i18nLinerHandlebars.js:92)
[3] brandable-css/index.js will decode that structure to arrive at the
exact URL for the stylesheet for that template for the current user
variant
with this , we should be able to optimize "rake canvas:compile_assets"
to run both brandable_css and webpack in parallel, which will greatly
mitigate the performance decrease from moving from node-sass to
dart-sass
== test plan
go to some assignment's syllabus page, edit the file
app/stylesheets/jst/courses/Syllabus.scss with something fun like:
#syllabus .day_date { background: $fire; }
rerun `npx brandable_css`, reload the page and verify it's on fire,
optionally change your setting to enable High Contrast mode, reload
the syllabus page and verify the color changes (it picks up the other
variant stylesheet)
[1]: 80af6e70af
Change-Id: Ie48cc71d4837ee02313b2d45a9ad2944725acad2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/268615
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: August Thornton <august@instructure.com>
QA-Review: August Thornton <august@instructure.com>
Product-Review: August Thornton <august@instructure.com>
the linter ran through an edge case in ea64444c39
test plan: run "yarn install" and ensure yarn.lock is not dirty
Change-Id: I7c61c0fb26d321b8a6f4eef6a77627696f6e065e
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/268601
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
Fix behavior inconsistency on some specific cases image modal following
a11y check like data-decorative and alt-text attributes
fixes MAT-154
flag=none
Test plan:
- Navigate to a RCE instance
Test 1:
- Upload an computer image
- Select decorative checkbox
- Submit modal
- Verify that the <img> tag has this attributes:
role="presentation" alt=""
- Verify that there are no a11y observations
Test 2:
- Upload an computer image
- Click a11y checker
- Verify that a11y checker let you decide if you want to add an
alt-text or setting it as decorative
Test 3:
- Upload an computer image
- Select decorative checkbox
- Submit modal
- Verify that there are no a11y observations (Similar like 1st)
Test 4:
- Upload an computer image
- Click to image options
- Clear alt text input
- Select decorative checkbox
- Submit tray
- Verify that the <img> tag has this attributes:
role="presentation" alt=""
Change-Id: Idffd778e431dd8c598c044144ed088bfcfe9a9c8
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/267104
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Product-Review: Juan Chavez <juan.chavez@instructure.com>
Reviewed-by: Ed Schiebel <eschiebel@instructure.com>
QA-Review: Ed Schiebel <eschiebel@instructure.com>
closes OUT-4593
flag=outcome_alignment_non_scoring_content
test plan:
- confirm that alignments on canvas wiki pages
continues to work by testing g/235665
Change-Id: Ie06ff171093b622b2ca5a73464dd11035f1f6776
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/268516
Reviewed-by: Pat Renner <prenner@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
QA-Review: Brian Watson <bwatson@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
flag=react_discussions_post
fixes VICE-1450
Test Plan:
-discussion topic text should use the full width
Change-Id: Iff6ca0833e0b2bfb1a4dfdb47b1a895964915bbc
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/268456
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeffrey Johnson <jeffrey.johnson@instructure.com>
QA-Review: Jeffrey Johnson <jeffrey.johnson@instructure.com>
Product-Review: Allison Pittler <allison.pittler@instructure.com>
Refs FOO-1891
flag=none
Canvas officially supports a fixed set of languages and locales.
Unfortunately, not all browsers support all of those (the worst
offender oddly enough is Google Chrome). Fortunately, polyfills
for almost all of the Canvas supported languages are available
via a polyfill package.
This commit introduces a function that asynchronously loads the
polyfill for a requested language. It does nothing if it sees
there is already native support in the browser for that
language. The function can be imported and run to dynamically
switch in and out the polyfills as necessary, but since Canvas
never changes ENV.LOCALE except at page load time, it should
suffice to call it at front end initialization time; this was
added to ui/index.js as a part of its "readiness" checks.
The missing one (that NO browser supports) is Haitian Creole;
we will have to probably build our own locale data file for
that one.
This takes care of polyfilling DateTimeFormat, NumberFormat,
and RelativeTimeFormat. We can always add other Intl systems
if the need arises.
Test plan:
* Be on Chrome (which does not support the Welsh language)
* In the browser console, verify no native support for Welsh:
Intl.DateTimeFormat.supportedLocalesOf(['cy'])
... should return an empty array
* Go into your user settings on Canvas and change your language
to Welsh (Cymraeg). Reload the page to make it take effect.
Now your settings page should appear in Welsh.
* In the browser console, verify that dates and times can be
formatted correctly in Welsh (thanks to the polyfill):
Intl.DateTimeFormat('cy', {
dateStyle: 'long',
timeStyle: 'long'
}).format(new Date())
* That should display a date and time in Welsh (most prominently
seen in the name of the month).
Change-Id: I40632344ba1d8679aba1a976fcb55af97636be4b
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/267359
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
Product-Review: Ahmad Amireh <ahmad@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
closes MAT-127
flag=rce_enhancements
We are missing many translatable strings because the extract process
was broken due to a change in how node treats relative imports
The fix needed a fixed copy of format-message-estree-util locally
until the format-message folks fix it. I opened an issue in github
and Ahmad created a pull request.
Also had to update some import formatMessage form 'format-message'
to the local format-message.js file in order to use the namespace
and not the global formatMessage
Found that canvas-planner suffered from the same issue. Reran
it's `yarn i18n:extrract` task and checked in the results
(though I think that's done automagically by jenkins for
the translation process)
test plan:
- packages/canvas-rce/locales/en.json has all the strings
(look for Fullstring or "Click or shift-click for the html editor")
Change-Id: I822472dc90fcc7792224a7acce46b00804893ed9
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/267755
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
QA-Review: Weston Dransfield <wdransfield@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
fixes FOO-2037
the result of removing yarn.lock and reinstalling packages according to
the latest version within their specified range
Change-Id: I1d2851d5a1a9fc6caeddc388492622ffd4f59379
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/255460
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
fixes FOO-1859
leave canvas-planner's dependency on DateTimeInput (part of v6) for
later
test plan: the world doesn't end
Change-Id: Iedbf1ccf0f815ed96f6f8f7d2a151f263ea35010
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/266766
Reviewed-by: August Thornton <august@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: August Thornton <august@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
QA-Review: Simon Williams <simon@instructure.com>
Product-Review: August Thornton <august@instructure.com>
Product-Review: Simon Williams <simon@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
fixes FOO-2047
according to the following BREAKING CHANGES:
- Removed ui-a11y, ui-elements, ui-layout, ui-forms
- Removed Modal, Popover, Tooltip and Tray from ui-overlays
test plan: there should be no behavioral changes as we're picking the
same components only from a different location
Change-Id: Id065d6e1d6eb49a3968c7c9db9443edaec9c0dfb
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/266452
Reviewed-by: Charley Kline <ckline@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
fixes INTEROP-6733
flag=none
Test plan
- Install more than 3 LTI tools
- Verify that you can launch an LTI
tool from the assignment submission
- Verify that all LTI tools load
and look ok
- Verify that if you choose the wrong type
of file from an LTI tool that it won't
let you submit
- Verify other types of submissions
also still work
Change-Id: If03f0d0e7532741d14bac0906feb07b66f1887b7
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/265629
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Tucker Mcknight <tmcknight@instructure.com>
Product-Review: Karl Lloyd <karl@instructure.com>
Reviewed-by: Xander Moffatt <xmoffatt@instructure.com>
Reviewed-by: Jeremy Stanley <jeremy@instructure.com>
Reviewed-by: Adrian Packel <apackel@instructure.com>
Reviewed-by: Sean Scally <sean.scally@instructure.com>
or you'll be in code-formatting wars
closes MAT-197
flag=none
test plan: n/a
Change-Id: I26e05aca06464b2190f27ec3449a639979a95e50
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/265316
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jackson Howe <jackson.howe@instructure.com>
QA-Review: Ed Schiebel <eschiebel@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
so it stops complaining about the ?. operator, among other things
closes MAT-45
flag=none
test plan:
- npx eslint ./path/to/a.js
on a file with ?. in it doesn't complain
Change-Id: I6056e25ce9c53a8e652d6e4eec1280057369cf26
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/265387
Reviewed-by: Guilherme Baron <gbaron@instructure.com>
QA-Review: Guilherme Baron <gbaron@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
closes MAT-142
flag=none
- the a11y checker has been updated
- @instructure/ui-forms is a stale dependency
- the update to installTranslations.js is to put a change
back that got overwritten somewhere along the line.
test plan:
- it builds and passes jenkins
Change-Id: I8827be86adccd58ec9ca53638b7eb7befd3468e1
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/264915
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
QA-Review: Jeff Largent <jeff.largent@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Fixes a security vulnerability
I had to bump the es-check es8 -> es9 because the new version of
axios-cache-adapter used an object spread operator which es8
didn't like, though it is supported by all our browsers and
I've checked that it does work at the spot es-check was flagging
closes MAT-115
flag=none
test plan:
- all the specs still pass
- everything seems to work well
- poke about in /accounts/2/developer_keys, because I made a little
change in create/edit developer keys.
Change-Id: Ib912b3c1e2e497e23999adc72aaa1d8abf53a345
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/264679
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Juan Chavez <juan.chavez@instructure.com>
Reviewed-by: Gary Mei <gmei@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
QA-Review: Gary Mei <gmei@instructure.com>
closes OUT-4312
flag = improved_outcomes_management
Test plan:
- Try to edit a group using Improved Outcomes Management
and make sure no functionality was broken
Change-Id: Ic7f7cf77189b7688187cfd530325aecc393a92c0
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/261655
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Pat Renner <prenner@instructure.com>
QA-Review: Brian Watson <bwatson@instructure.com>
Product-Review: Augusto Callejas <acallejas@instructure.com>
closes MAT-108
flag=none
Primary changes revolved around getting canvas-media to talk to RCS
instead of directly to canvas. This necessitated passing more
info from canvas -> rce -> canvas-media so it can connect.
In the process, merged the 2 functions that uploaded closed captions
into one.
the change in root.js that lazy loads tinyRCE is to get the
canvas-rce bundle size below size limits, which it blew
after a rebase.
test plan:
This should work with you config/dynamic_settings.yml
development.config.canvas.rich-content-service.app-host
value = 'http://host:port'
or simply 'host:port'
- in the RCE, upload a video with closed caption
using the Media > Upload/Record command.
> expect the video to show up with CC
- edit the captions in the video options tray
> expect the captions to be updated
> bonus result: no console warning about missing file.name
prop from ClosedCaptionPanel
- in the RCE, open Upload Document and select
a video.
> expect the video to upload an show up.
- create a media recording type assignment
- enable the "Assignment Enhancements - Student" feature
- as a student, visit the assignment
- click the "Recort/Upload" button
> expect the video upload and CC feature to work as expected
> bonus fix: the CCs should be at the bottom of the video
Change-Id: I7b574bb67998072324954a6b481e0c4d3b3251de
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/264109
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
QA-Review: Jeff Largent <jeff.largent@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
flag = none
set WEBPACK_PEDANTIC=0 to prevent the build from bailing on warnings
set WEBPACK_ANALYSIS=1 to generate an html report of the bundles
test plan ::
run webpack with the analysis flag and verify it 1) works and 2)
generates a report at tmp/webpack-bundle-analysis.html
WEBPACK_ANALYSIS=1 \
WEBPACK_PEDANTIC=0 \
NODE_OPTIONS="--max_old_space_size=8096" \
npx webpack
Change-Id: Icc77b2477c2fb9d3394e4c41d2377212f93534c6
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/261892
Reviewed-by: Ed Schiebel <eschiebel@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Ahmad Amireh <ahmad@instructure.com>
closes MAT-67
flag=none
This mostly resurrects the demo app that was abandoned a while ago,
updated to use the fledgling TheRCE react component instead of
RichContentEditor.loadNewEditor.
In the process I discovered a couple differences in the order of
execution when initializing RCEWrapper, so it has a couple changes.
test plan
- from the packages/canvas-rce directory, run
yarn demo:dev
- once it builds, expect your browser to load
http://localhost:8080
> expect to see a working RCE
note: the a11y checker does not work yet
> expect the RCE to still load and work in Canvas
(a sniff test should be sufficient)
Change-Id: I396747056b475c4127125d377f9683f47fa6625a
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/263543
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Nate Armstrong <narmstrong@instructure.com>
QA-Review: Nate Armstrong <narmstrong@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Closes FOO-1857
flag = none
InstUI 6 had a combo DateTimeInput component which went away as
of version 7. It's used in a couple of places in Canvas, so we
recreate that functionality in a shared component. Tricky stuff
to work in all time zones and all DST systems.
Test plan:
* tests pass (nothing uses this yet)
* not sure if the included Storybook will work or not
Change-Id: I053a936e5cb505100a0e44571d29584094bad4f2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/262459
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jacob Burroughs <jburroughs@instructure.com>
QA-Review: Jacob Burroughs <jburroughs@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
closes MAT-40
flag=auto_show_cc
Requested by the Columbus Public Schools (my homies), create a
setting so videos automatically show CCs when playing
videos.
test plan:
- create RCE content and include a video
- add a couple CC files in different languages, including the
user's language (the .srt files don't have to be in another language,
just tell canvas they are)
- save
> expect no CC without selecting them from the CC menu in the
media player
- click on the user's avatar to open the user's tray and choose Settings
- enable the "Automaticaly show media captions" feature
- refresh to the page with RCE content
> expect the CCs in the user's language to automatically show
- change the user's language to another one you have CCs for
- refresh the page with the video
> expect the new language's CCs
- change the user's language to something not in the CC list
and not English
- refresh the video page
> no CCs and nothing bad happens.
note: I wanted to test with with various combinations of en, en-US,
and en-GB but canvas won't let you add CCs in regional locales. I don't
know why, but that's a problem for another day.
Change-Id: I355fd12c5ea42fe5bc8e776a0c602c2857aaf4c6
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/262500
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Nate Armstrong <narmstrong@instructure.com>
QA-Review: Nate Armstrong <narmstrong@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Closes FOO-1805
flag = none
Also brings all of canvas-media up to InstUI 7
Test plan:
* tests pass
* canvas media still works
Change-Id: I64beb416ecc118ea5de91d25968e8878e53816a8
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/262107
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ed Schiebel <eschiebel@instructure.com>
QA-Review: Ed Schiebel <eschiebel@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
flag=canvas_inbox
fixes VICE-1240
TEST PLAN:
- yarn
- yarn jest
app/jsx/canvas_inbox/containers/__tests__/CanvasInboxFullPage.test.js
should pass
Change-Id: Ibaf618e8abae4aad63d6e1dabf1a1ea20f5c9dd6
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/261392
Reviewed-by: Brian Watson <bwatson@instructure.com>
Reviewed-by: Davis Hyer <dhyer@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Davis Hyer <dhyer@instructure.com>
Product-Review: Davis Hyer <dhyer@instructure.com>
Closes FOO-1717
flag = none
This was the result of the InstUI codemod per the v7
upgrade guide instructions
Test plan:
* build still passes
* no clue how we'd manually QA all this. Any ideas?
Change-Id: I6ca72bfabca0628761be00d8bed27dda103e0711
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/260817
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
QA-Review: August Thornton <august@instructure.com>
Product-Review: August Thornton <august@instructure.com>
This change aims to fix tree-shaking issues introduced in InstUI 7 by
the addition of `"type": "module"` to the packages' package.json
files. It updates the following major versions to their latest minor /
patch versions:
* 7 -> 7.4.4
* 6 -> 6.27.0
It also updates @instructure/ui-icons from v6 to v7, since nothing has
changed between those versions except the addition of new icons and a
slight tweak to the "add" and "x" icons to make them more closely
match product designs.
It also updates @babel/core, @babel/runtime, and
@babel/runtime-corejs3 to latest (7.13.10) to fix this babel issue:
https://github.com/babel/babel/issues/12854.
The dependency changes also shuffled around the webpack build a bit--
the assignment_edit bundle is now (slightly) over the max asset size
limit, while quizzes_bundle and screenreader_gradebook are not any
more.
fixes LS-2016
flag = none
Test plan:
- Ensure everything in canvas still works and looks the same
Change-Id: I262012c9b752cec617f425c57e8c276bc7870b21
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/260391
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Ahmad Amireh <ahmad@instructure.com>
Fixes FOO-1674
flag = none
Update webpack-cli dependency to pull in a bugfix which was
preventing the webpack:analyze tool from working.
Test plan:
* yarn webpack:analyze works again
* nothing else broke (major version number changed!)
Change-Id: I5f6ee48ea7b24bda9e13e73f44cee8cf23abfc22
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/260189
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
QA-Review: Jeff Largent <jeff.largent@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
Most of the upgrades were backwards-compatible, but I made a few
changes:
* Replaced usages of wait, waitForElement, and waitForDomChange with
waitFor as recommended here, since they are deprecated:
https://testing-library.com/docs/dom-testing-library/api-async/#deprecated-methods
* Replaced '@testing-library/react-hooks' imports with
'@testing-library/react-hooks/dom' as recommended here:
https://react-hooks-testing-library.com/installation#being-specific
* Fixed some issues with @testing-library/jest-dom's toBeDisabled
matcher not checking for the disabled attribute on parent elements--
e.g. changing this:
`expect(getByText('Button Text')).toBeDisabled()`
to this:
`expect(getByRole('button', {name: 'Button Text'})).toBeDisabled()`
closes LS-1831
flag = none
Test plan: tests pass in Jenkins
Change-Id: Ia549950dade5fd5b2597a3002b11f4f0a6f740f2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/258923
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
refs OUT-4237
flag=none
Test-plan: > yarn install
> yarn storybook
- Look through outcomes stories in storybook quickly,
verify everything loads
> yarn test-storybook
- Verify everything passes, if something doesn't pass,
verify that that corresponding story is also broken in
storybook
> echo $? # should return 0 and jest results should say 0 failures
- Change one of the stories so that it doesn't render,
For example: undo the changes made to ManagementHeader.stories.js
in tis PS
> yarn test-storybook
- Verify that it fails
> echo $? # should return 1 and jest results should say 1+ failure(s)
Change-Id: I492f50d861dccdfdf4a958fd007da44041f9dd49
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/258297
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeffrey Johnson <jeffrey.johnson@instructure.com>
Reviewed-by: Michael Brewer-Davis <mbd@instructure.com>
QA-Review: Pablo Gomez <pablo.gomez@instructure.com>
Product-Review: Brian Watson <bwatson@instructure.com>
closes LS-1657
flag=none
This change required code-splitting the canvas-planner/index.js entry
point by introducing lazy-loaded components to keep the bundle
below our max allowable size.
A unit test was failing with the tests running concurrently and I
couldn't find the root cause. Having them to run serially fixed it.
(See package.json)
test plan:
- canvas still builds
- no jenkins errors
> expect the student planner to still work and look right
- open a course
> expect the ToDo list in the sidebar to load
Change-Id: I96b593e385eabf2195fb55e611c68c0d60d1f57a
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253898
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
QA-Review: Robin Kuss <rkuss@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
refs FOO-1331
refs LS-1657
flag = none
test plan: canvas-rce mocha tests work after upgrading to inst-ui 7
Change-Id: Ibe8d94fdd5a994fda2c7b9703dccfb77a62415ca
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256766
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ed Schiebel <eschiebel@instructure.com>
QA-Review: Ed Schiebel <eschiebel@instructure.com>
Product-Review: Simon Williams <simon@instructure.com>
fixes FOO-1409
flag = none
no more client_apps, canvas_quizzes now lives as part of canvas-lms
proper inside app/jsx/, which makes the build leaner and leaves us with
one less thing to reason about
logical changes:
- converted from AMD to ES modules
- upgraded to recent react + react-router
- dropped RSVP in favor of native Promises
- used CanvasModal instead of home-grown Dialog
- removed dead code; notifications in particular were fishy as there had
no dependents at all and did not even show up in the graph
- ported tests to Jest, added more unit ones and two integration ones
- removed "config.onError" and now throws errors where appropriate
- disabled console statements in non-dev
:: test plan ::
- create a (old-school) quiz containing all types of questions
- as 3 distinct students, take the quiz and try to randomize your
answers
at this point it's helpful to have a reference to compare the screens; I
replicated the quiz on my production sandbox for this
- go to /courses/:id/quizzes/:id/submissions/:id/log
- verify it looks OK
- click on a specific question in the stream and verify the question
inspector widget works OK
- go back to stream and push "View table"
- verify the table and its controls are OK
- go to /courses/:id/quizzes/:id/statistics
- verify it looks OK
- click on ? in the discrimination index chart and verify it displays
a dialog with help content
- click on "X respondents" in one of the charts and verify it displays
a dialog with the respondent names
- verify the interactive charts do interact as expected (no logic
changed here so just a quick glance)
- link to "View in SpeedGrader" for essay-like questions works
Change-Id: I79af5ff4f1479503b5e2528b613255dde5bc45d3
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256118
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: Simon Williams <simon@instructure.com>
Product-Review: Simon Williams <simon@instructure.com>
refs DE-397
De-duplicating yarn.lock is necessary for some future InstUI upgrade work. In order to do this, we need to patch karma-webpack to avoid watching too many files within our JS job. We also need to pin babel-plugin-dynamic-import-node to the latest to work around a breaking change that causes “request of a dependency is an expression”.
Both of these version pins are work arounds and will be addressed by our efforts to upgrade webpack to v5.
Test Plan:
1. Ensure that “yarn dedupe-yarn” does not produce any file changes.
2. Ensure that the “JS (Karma)” job does not produce any warnings like “request of a dependency is an expression”
3. Ensure that the “JS (Karma)” job does not produce any warnings like “System limit for number of file watchers reached”
4. Ensure that Canvas front-end builds & behaves properly
Change-Id: I94d77bd775bc12f9f96ac44640c862ff3e3dee79
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256674
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Ahmad Amireh <ahmad@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Ahmad Amireh <ahmad@instructure.com>
closes LS-1733
flag=rce_pretty_html_editor
requires rce_enhancements to be on as well. I'm not sure the
new flag is necesary, and as of PS1, it doesn't fully hide the
new html editor functionality.
The INSTUI CodeEditor component uses CodeMirror v5, which sadly
is not accessible. https://github.com/codemirror/codemirror.next,
or https://codemirror.net/6/ for details on a future version.
For now, the RCE still provides access to the raw textarea if
KB access is needed by the user.
BONUS FEATURE! the html editors can now be viewed fullscreen
test plan:
- with the Pretty html editor feature flag off
- click the </> button
> expect the old boring html editor
- turn on Pretty HTML Editor feature flag
- click the </> button
> expect the deluxe new html editor
- click the "Raw HTML Editor" link
> expect the old boring editor
- click the "Pretty HTML Editor" link
> expect the pretty editor
- click the </>
> expect to be back in the rce
- shift-click the </>
> expect the old editor
- from anywhere, click the fullscreen button (except in safari
when in the old editor, safari won't fullscreen the textarea so
the button should be hidden)
> expect to be in fullscreen
- if you fullscreened the RCE, you can select "View > HTML Editor"
from the menubar
> expect to be in the html editor, fullscreened
- ESC
> expect to exit fullscreen
- edit your content anywhere
> expect the changed to be reflected everywhere else
- try it on a discussions or quizzes page with >1 RCE
> the editors and fullscreen should work as you expect
Change-Id: If5b17b2357a4ff5521f0cb9c42bd6a5a096f2436
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/255928
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Jeff Largent <jeff.largent@instructure.com>
Product-Review: Peyton Craighill <pcraighill@instructure.com>
closes LS-1609
flag=rce_enhancements
Had to nohiost tinymce so it remains w/in canvas-rce
where RCEWrapper.js can require tinymce's stylesheets, but it
still needs to be a dev dep. of canvas-lms because there are
specs that import tinuymce.
Moved the matchMedia jsdon polyfill into jest-setup where it can be
used by everyone. Need it there since the new tinymce calls it.
test plan:
- specs pass
- the RCE still works and looks the same
Sorry, I don't know what else to say
Change-Id: I8c956664176b7c25995a55e0c6fea4dafad3970f
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/255604
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Nate Armstrong <narmstrong@instructure.com>
QA-Review: Nate Armstrong <narmstrong@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
fixes FOO-1116
flag = none
this upgrade was problematic mostly because of Node's support for ES
modules (ESM) that is still fairly recent and introduces some complexity
around packaging. This is also the reason for the considerable hack
related to @instructure packages (see inline documentation) that can be
removed once we fix things upstream
| test plan |
| --------- |
- install node 12 if needed (e.g. not on docker)
- purge your node modules:
rm -rf {.,client_apps/*,gems/*,gems/plugins/*,packages/*}/node_modules
- make sure you can still build locally (native/docker)
bundle exec rake canvas:compile_assets
Change-Id: If9605ac428f0ff228f8852f0becb9fbac750f1f2
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253166
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Simon Williams <simon@instructure.com>
Reviewed-by: Charley Kline <ckline@instructure.com>
QA-Review: Simon Williams <simon@instructure.com>
QA-Review: Charley Kline <ckline@instructure.com>
Product-Review: Charley Kline <ckline@instructure.com>
Closes LS-1683
flag=none
Test Plan: Jenkins passes (does not imply testcafe is running)
Change-Id: I4a35b2e355cb5eb0ed81f78b4435700884ca6266
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/251531
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
QA-Review: Robin Kuss <rkuss@instructure.com>
Product-Review: Robin Kuss <rkuss@instructure.com>
This is the message collection on the left hand side of the Inbox.
Test Plan:
- Run Storybook
- Verify that the MessageListHolder story is rendering as expected
-- Unread converstaions should have an unread badge
-- The number badge should show the total number of messages in the
thread
-- The checkbox should fire the onSelect action
-- Mousing over a conversation should show its star button
-- Clicking the star button on a conversation should fill in the icon
and make the button persist even when moused out of the conversation
-- Clicking the star button should fire the onStar callback
closes VICE-844
Change-Id: Ia554f8fe9717934dcb72569360a7b180537583c1
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253560
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Davis Hyer <dhyer@instructure.com>
QA-Review: Davis Hyer <dhyer@instructure.com>
Product-Review: Davis Hyer <dhyer@instructure.com>
closes LS-1652
flag=rce_enhancements
updates the packages/canvas-rce package to instui 7, except for select
which will be in another ticket.
test plan:
- everything in the RCE still looks right
- especially:
- the content tray
- the new link dialog
- the image/link/media options trays
- the upload dialogs
most of the rest is tinymce.
Change-Id: I7ab44df8b06dc78f51013514e4ae208f674e3bec
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253766
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Jackson Howe <jackson.howe@instructure.com>
QA-Review: Robin Kuss <rkuss@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
refs FOO-1116
flag = none
this has been a controversial upgrade since, on the one hand, node-sass
is deprecated and we need to move to dart-sass, but then doing that will
require some work as i've seen a few major visual regressions caused by
the transition (see patch for dart-sass)
we can get node-sass unto the latest (that does compile under node12+)
by changing our use of :not() with a selector list:
:not(.a, .b)
to:
:not(.a):not(.b)
see this gist for a more thorough explanation and rationale: https://gist.github.com/amireh/867a00a36588fc6490c38813cf2558c3
:: test plan ::
- we are able to install dependencies on BOTH node10 and node12
- we must make sure there are no regressions to SIS-3125
Change-Id: If8c396e6404cb6d868997b399007a06e8d1e9548
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253764
Reviewed-by: August Thornton <august@instructure.com>
QA-Review: August Thornton <august@instructure.com>
Product-Review: August Thornton <august@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
refs FOO-1116
flag = none
this pulls in a version of the package that can work under node > 10,
see https://github.com/instructure/i18nliner-handlebars/pull/2
:: test plan
you need to try this in both node 10 and node 12, run webpack when you
switch versions
create a module in a course that has some students and add some stuff
to it, then view its progress and verify the student names show up
fine
Change-Id: I5f5b110b64cc6ffab3dc190785c641c0b3bc5b4a
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/253070
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: Simon Williams <simon@instructure.com>
Product-Review: Ahmad Amireh <ahmad@instructure.com>
Jeff Largent