All files / roosterjs-content-model-dom/lib/modelToDom/handlers handleImage.ts

100% Statements 28/28
100% Branches 14/14
100% Functions 1/1
100% Lines 25/25

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 561x 1x 1x           1x             53x 53x   53x 53x   53x   53x 1x     53x 1x     53x 53x   53x 53x 53x   53x 1x     53x 1x     53x 23x           53x    
import { applyFormat } from '../utils/applyFormat';
import { handleSegmentCommon } from '../utils/handleSegmentCommon';
import { parseValueWithUnit } from '../../formatHandlers/utils/parseValueWithUnit';
import type { ContentModelImage, ContentModelSegmentHandler } from 'roosterjs-content-model-types';
 
/**
 * @internal
 */
export const handleImage: ContentModelSegmentHandler<ContentModelImage> = (
    doc,
    parent,
    imageModel,
    context,
    segmentNodes
) => {
    const img = doc.createElement('img');
    const element = document.createElement('span');
 
    parent.appendChild(element);
    element.appendChild(img);
 
    img.src = imageModel.src;
 
    if (imageModel.alt) {
        img.alt = imageModel.alt;
    }
 
    if (imageModel.title) {
        img.title = imageModel.title;
    }
 
    applyFormat(img, context.formatAppliers.image, imageModel.format, context);
    applyFormat(img, context.formatAppliers.dataset, imageModel.dataset, context);
 
    const { width, height } = imageModel.format;
    const widthNum = width ? parseValueWithUnit(width) : 0;
    const heightNum = height ? parseValueWithUnit(height) : 0;
 
    if (widthNum > 0) {
        img.width = widthNum;
    }
 
    if (heightNum > 0) {
        img.height = heightNum;
    }
 
    if (imageModel.isSelectedAsImageSelection) {
        context.imageSelection = {
            type: 'image',
            image: img,
        };
    }
 
    handleSegmentCommon(doc, img, element, imageModel, context, segmentNodes);
};