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>
- not directly related to the RCE, but now preload the
3 lato-exended font variants likely to be used
on the page. this keeps font loading from blocking
- the big change is to make it possible to limit the number
of RCEs that will fully render on page load. This should
address the loading issues for quizzes with many essay questions
(the sample quiz from Harvard had 30 + other questions)
For now, the necessary property is only being set on the
take-quiz page
closes: MAT-355
flag=rce_enhancements,flag=rce_limit_init_render_on_page
test plan:
account flag.
- create a legacy quiz with > 5 essay questions. Feel
free to have other questions in there too if you like
- preview or take the quiz
> expect all 6 RCEs to be created on the page
- you could use React dev tools or
document.querySelectorAll('.rce-wrapper').length === 6
- turn the "RCE Limit number of RCEs initially rendered on th page"
account feature flag on
- take the quiz again
> expect only the first 5 RCEs to be fully rendered
- scroll down to the bring the 6th into view
> expect it to be fully realized
- while scrolled to the bottom, refresh the page
> not that the 6th RCE is in view, expect it to be
fully realized also
Change-Id: Idd76a56c4ea69e45a4f1cc28e3cd8561b40c2403
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/270075
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Weston Dransfield <wdransfield@instructure.com>
Reviewed-by: Jon Scheiding <jon.scheiding@instructure.com>
Product-Review: Ed Schiebel <eschiebel@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>
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-277
flag=rce_enhancements
Factored these changes out of the changes I had to make for MAT-253 where
the CanvasRce component was put on a real page and tested.
1. update jest.config.js to mock the tinymce-react Editor component
2. add a missing dependency to package.json
3. tweak tests to use the new mock
4. use safe-dereference operator in places where specs might
not have a fully formed ENV
test plan:
- this is a tough one. It has to pass jenkins, but beyond
that it will take the changes for MAT-253 to prove these
changes do all we need
Change-Id: I5804d1a1f13dbfbc21a3213db92d7afe74e576e6
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/267427
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Gary Mei <gmei@instructure.com>
QA-Review: Gary Mei <gmei@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>
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>
refs DE-687
As part of our work on EKS, we need to align the EC2 / EKS paths to pull artifacts from the same path on the container and host. As a step towards that, ensure that all containers output their test files to the same directory.
Change-Id: I312fb5f8505122c68ba5aaba30730aa5c1887177
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/265370
Reviewed-by: Kyle Rosenbaum <krosenbaum@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Aaron Ogata <aogata@instructure.com>
Product-Review: Aaron Ogata <aogata@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>
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 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-65
flag=none
- The update to package.json corrects a typo in the command line,
line, plus adds a directory needed to load brandable_css
- The instui babel presets in the new .babelrc.json file are needed
if you want an RCE in storybook
- The change to ENV in preview.js is needed if you want an RCE in
storybook
test plan:
- storybook builds and everything still works
- components are rendered using the Lato font family
Change-Id: I04c45e4dc6bd853c3513ff689d63f6388d874ec1
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/263291
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: Jeffrey Johnson <jeffrey.johnson@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>
flag = none
stderr output of the individual processes fed to "wsrun" are being
swallowed if it's running in --parallel and asked to --collect-logs
see: https://github.com/hfour/wsrun/issues/107
see: https://github.com/hfour/wsrun/issues/92
== test plan
grab the following image from starlord and verify you see the actual
error output from the canvas-rce package:
export IMAGE="starlord.inscloudgate.net/jenkins/canvas-lms:63.262363.4-postgres-12-ruby-2.6-failed" &&
docker pull "$IMAGE" &&
docker run \
-v "$PWD"/package.json:/usr/src/app/package.json:ro \
--rm -it \
"$IMAGE" \
yarn build:packages
Change-Id: I7650e6b9b83bb22faea569eba05a9f73f5e72b4f
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/262410
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Aaron Ogata <aogata@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Ahmad Amireh <ahmad@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>
because simply asking it to run yarn-deduplicate is no longer good
enough, you must now be polite when doing it[1]:
To prevent security and user-experience problems from mistyping
package names, npx prompts before installing anything. Suppress
this prompt with the -y or --yes option.
we will also be updating npm to the latest to catch such issues in the
future
== test plan
running "rake canvas:compile_assets" using npm > 7 completes
without hanging indefinitely at the "install dependencies" stage
[1]: https://docs.npmjs.com/cli/v7/commands/npx#compatibility-with-older-npx-versions
Change-Id: I81e044d20143991cf6103084f44ce8d4c9011f5b
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/259662
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Aaron Ogata <aogata@instructure.com>
QA-Review: Ahmad Amireh <ahmad@instructure.com>
Product-Review: Ahmad Amireh <ahmad@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>
[fsc-timeout=30]
closes LS-1792
flag=none
I had to add ignore_js_errors:true to some of the selenium specs
because the global nav is generating a react "can't update state on
an unmounted component" errors. FOO-1541 was created to look into
that.
test plan:
> it passes js and selenium specs (this is the biggie, I think)
I changed 404file upload, and grade_summary pages
- go to /foo
> expect the "sorry" page to look the same as before
- go to file upload
> it works
- go to /courses/:id/grades/:stud_id
> expect the "Arrange By" Select to work as expected
(I couldn't figure out how to get any other of the Selects
to show up, but looking at the selenium specs provides clues.
I'm sorry that I'm not more help.)
Change-Id: I8eceb721b17e2cb1aec17de56a0145610b11d6ab
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256767
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
QA-Review: Robin Kuss <rkuss@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
Reviewed-by: Jackson Howe <jackson.howe@instructure.com>
Reviewed-by: Jeff Largent <jeff.largent@instructure.com>
fixes FOO-1527
flag = none
test plan: you can install node modules and run webpack
Change-Id: I33347d791b0923f4471b555c6fac303b098b1ef4
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/257333
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: Simon Williams <simon@instructure.com>
Product-Review: Simon Williams <simon@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>
fixes FOO-1435
flag = none
instead of the bundler inferring the source file that an extension is
meant for based on filepath, a plugin is now expected to explicitly map
each source file to the extension file in its package.json manifest
{
"canvas": {
"source-file-extensions": {
"path/to/a.js": "path/to/extension-to-a.js"
}
}
}
this allows extensions to continue working even when the path of the
source file no longer matches that of the extension inside the plugin
== test plan
- visit a page that contains an extended module and verify the extension
is still applied
Change-Id: Ida7d75b87aedc519502c969e6912a335af69abc0
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256222
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>
flag=none
this commit also removes the phantomjs docker-compose service which has
been broken for years, ever since PhantomJS was removed from
karma.conf.js in https://gerrit.instructure.com/c/canvas-lms/+/102169
test plan:
- follow the docs to ensure you can run a targeted JS test in docker
Change-Id: Ifa1647897a7a9605e097aeaf89e718c167d379fc
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/256179
Reviewed-by: Nate Armstrong <narmstrong@instructure.com>
QA-Review: Nate Armstrong <narmstrong@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Product-Review: Michael Ziwisky <mziwisky@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>
refs FOO-1116
flag = none
test plan: we can install `yarn install`
Change-Id: I0e78958130368a11eb007d1ffddbd075f27d9380
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/254937
Reviewed-by: Jacob Burroughs <jburroughs@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>
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>
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>
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>
Jeff Largent