Files
api/web/helpers/markdown.ts
Michael Datelle 0e008aaf1e test: setup initial test, config and testing libraries (#1309)
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Introduced comprehensive testing utilities for Vue components
utilizing the composition API.
- Enhanced testing coverage for the `DownloadApiLogs` and `KeyActions`
components, ensuring robust functionality and user interaction
validation.
- Added mock implementations for various libraries and components to
facilitate isolated unit testing.
- Improved flexibility in the `DummyServerSwitcher` component's input
handling.
- Added a new test setup file to configure the testing environment for
Vue applications.
- Added new test files for `AuthComponent` and `KeyActions` with
comprehensive test cases.
- Introduced a new mock implementation for UI components to streamline
testing.
- Added a new mock implementation for the `useRequest` composable to
prevent hanging issues during tests.
- Added a new mock implementation for the server store used by the Auth
component.

- **Bug Fixes**
- Improved sanitization process to block inline styles for a safer and
more consistent display.

- **Documentation**
- Added README documentation for Vue Component Testing Utilities,
detailing usage and examples.
  - Updated ESLint configuration to ignore coverage directory files.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: mdatelle <mike@datelle.net>
Co-authored-by: Eli Bosley <ekbosley@gmail.com>
2025-04-03 15:50:49 -04:00

49 lines
1.4 KiB
TypeScript

import DOMPurify from 'isomorphic-dompurify';
import { Marked, type MarkedExtension } from 'marked';
const defaultMarkedExtension: MarkedExtension = {
hooks: {
// must define as a function (instead of a lambda) to preserve/reflect bindings downstream
postprocess(html) {
return DOMPurify.sanitize(html, {
FORBID_TAGS: ['style'],
FORBID_ATTR: ['style'],
});
},
},
};
/**
* Helper class to build or conveniently use a markdown parser.
*
* - Use `Markdown.create` to extend or customize parsing functionality.
* - Use `Markdown.parse` to conveniently parse markdown to safe html.
*/
// eslint-disable-next-line @typescript-eslint/no-extraneous-class
export class Markdown {
private static instance = Markdown.create();
/**
* Creates a `Marked` instance with default MarkedExtension's already added.
*
* Default behaviors:
* - Sanitizes html after parsing
*
* @param args any number of Marked Extensions
* @returns Marked parser instance
*/
static create(...args: Parameters<Marked['use']>) {
return new Marked(defaultMarkedExtension, ...args);
}
/**
* Parses arbitrary markdown content as sanitized html. May throw if parsing fails.
*
* @param markdownContent string of markdown content
* @returns safe, sanitized html content
*/
static async parse(markdownContent: string): Promise<string> {
return Markdown.instance.parse(markdownContent);
}
}