531b3a359a
This change
1. moves the feature flag from RootAccount to SiteAdmin, as it should
not be manipulated by any of our institutions
2. hides the mobile login qr code from fullstory using their fs-exclude
class name
3. hides the users' avatars by adding a data-fs-exclude attribute to all
instances of the instui Avatar component, which we an then filter on
in the fullstory UI (because instui doesn't let us add a className)
4. hides the users' avatars that are not Avatar by adding .fs-exclude
Note: I am hiding all <img> elements via the FullStory UI, but this does
not hide Avatar, which puts the image in as a background-image
closes UXS-97
flag=enable_fullstory
test plan:
- you can really only test in beta where fullstory can capture
sessions and see that user avatars and the qr code are hidden
Change-Id: Ic8b73a2d7cd0474c1fd9a5337f747b76e5f67d06
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/232666
QA-Review: David Tan <dtan@instructure.com>
Reviewed-by: Augusto Callejas <acallejas@instructure.com>
Reviewed-by: Alex Anderson <raanderson@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
|
||
|---|---|---|
| .. | ||
| locales | ||
| scripts | ||
| src | ||
| .babelrc.js | ||
| .gitignore | ||
| Dockerfile | ||
| LICENSE | ||
| README.md | ||
| build.sh | ||
| docker-compose.yml | ||
| jest-env.js | ||
| jest-themeable-styles.js | ||
| jest.config.js | ||
| package.json | ||
| themeable.config.js | ||
README.md
canvas-planner
Canvas Planner is the UI component for the List View Dashboard feature in Canvas.
Development
Getting Started
Canvas Planner includes a prepublish script which runs a build anytime it's installed. As canvas
resolves its dependencies, this builds planner before it's installed into canvas-lms/node_modules.
To facilitate active development, create a link between planner and canvas. Since the normal
yarn install process copies planner into canvas-lms/node_modules/canvas-planner, changes in planner's source
won't be reflected in canvas until yarn is rerun. This inconvenience can be dealt with by linking
the two together.
- From the
canvas-lms/packages/canvas-plannerdirectory, runyarn link.- This only needs to be done once
- Then from the root
canvas-lmsdirectory, runyarn link canvas-planner.- This needs to be rerun anytime canvas' dependencies are reinstalled (say after
rm -fr node_modules).
- This needs to be rerun anytime canvas' dependencies are reinstalled (say after
These steps create a symbolic link between the planner source subdirectory
and canvas' node_modules. You can confirm this by running ls -l node_modules/canvas-planner from the canvas-lms root directory, which should respond with
node_modules/canvas-planner -> ../packages/canvas-planner
and not the contents of the directory.
Finally, start watched builds
- In
canvas-lms/packages/canvas-planner, runyarn build:watch - In
canvas-lms, runyarn build:watch
Now any changes to the planner source will trigger a planner incremental build, which will in turn trigger a canvas incremental build.
If you are doing a lot of CSS work, the watch commands don't track changes so well. If you find this is the case,
you can run yarn build:dev. This variant does not watch, but still sets up the environment so that class
names and theme variables are not mangled by the INSTUI themeable tooling.
Any commands discussed in the rest of this document assume your current working directory is
canvas-lms/packages/canvas-planner.
Linting
This project uses eslint-config-react-app
for linting JS files. Linting is enforced at the build level. ESLint errors will cause the build to fail.
You can run the linter by running yarn lint.
Debugging
In lieu of verbose console logging, planner uses the Redux DevTools Extension.
To use it, simply install the extension for your
browser of choice, then go to the planner and open your web inspector. From there, select the newly added Redux tab
and a plethora of useful debugging tools and information will be displayed.
Testing
We use Jest for testing the codebase. You can run it
by running yarn test for a single run or yarn test:watch to start up a watcher process for it.
If you are having trouble with the watch process you may need to set up [watchman] (https://facebook.github.io/watchman/).
It should be as simple as brew install watchman on a Mac, no configuration is required. For more details about these
issues see the discussion on the issue, watch mode stopped working on macOS Sierra.
We require test coverage percentages to be maintained. Run the test coverage by running yarn run test:coverage
You can limit the scope of your testing to a single file by providing it on the command line.
yarn test src/components/BadgeList/__test__/BadgeList.spec.js
Production
When canvas is built for production, the same process applies. When satisfying its canvas-planner dependency,
planner is built and installed it into node_modules. From there it is packaged
and minified by canvas' webpack build process.