@instructure/platform-mock-canvas-api

Mock Canvas API handlers using MSW (Mock Service Worker) for development and testing.

Installation

pnpm add -D @instructure/platform-mock-canvas-api msw

Usage

In Browser (Demo App, Storybook)

import { setupWorker } from 'msw/browser'
import { handlers } from '@instructure/platform-mock-canvas-api'

const worker = setupWorker(...handlers)
worker.start()

In Tests (Vitest, Jest)

import { setupServer } from 'msw/node'
import { handlers } from '@instructure/platform-mock-canvas-api'

const server = setupServer(...handlers)

beforeAll(() => server.listen())
afterEach(() => server.resetHandlers())
afterAll(() => server.close())

Using Individual Handler Groups

import { courseHandlers, submissionHandlers } from '@instructure/platform-mock-canvas-api'

// Use only course handlers
const worker = setupWorker(...courseHandlers)

// Or combine with your own handlers
const worker = setupWorker(...courseHandlers, ...myCustomHandlers)

Using Fixtures

import { courses, submissions, stickerDescriptions } from '@instructure/platform-mock-canvas-api/fixtures'

// Access mock data directly
console.log(courses) // Array of 5 courses
console.log(submissions) // Array of 5 submissions

Included Endpoints

Courses

• GET /api/v1/courses - List all courses
• GET /api/v1/courses/:courseId - Get single course

Submissions

• GET /api/v1/courses/:courseId/assignments/:assignmentId/submissions/:submissionId
• PATCH /api/v1/courses/:courseId/assignments/:assignmentId/submissions/:submissionId
• GET /api/v1/courses/:courseId/assignments/:assignmentId/submissions

Mock Data

• 5 Courses: CS 101, MATH 201, ENG 150, BIO 110, HIST 100
• 5 Submissions: With various stickers and grades
• 51 Sticker Descriptions: Full i18n support
• Sticker Translations: UI text translations

Development

# Build the package
pnpm build

# Type check
pnpm type-check