Power BI görselleri test yardımcı programları

Bu makale Power BI görselleri test yardımcı programlarını yüklemenize, içeri aktarmanıza ve kullanmanıza yardımcı olur. Bu test yardımcı programları birim testi için kullanılabilir ve veri görünümleri, seçimler ve renk şemaları gibi öğelere yönelik sahteleri ve yöntemleri içerir.

Önkoşullar

Bu paketi kullanmak için şunları yükleyin:

Yükleme

Test yardımcı programlarını yüklemek ve bağımlılığını package.json eklemek için Power BI görselleri dizininizden aşağıdaki komutu çalıştırın:

npm install powerbi-visuals-utils-testutils --save

Aşağıda test yardımcı programları genel API'sine ilişkin açıklamalar ve örnekler verilmiştir.

VisualBuilderBase

VisualBuilder tarafından birim testlerinde en sık kullanılan , ve updateRenderTimeoutyöntemleriyle buildupdatekullanılır.

yöntemi, build görselin oluşturulmuş bir örneğini döndürür.

Demet enumerateObjectInstances ve biçimlendirme seçeneklerindeki değişiklikleri denetlemek için ve updateEnumerateObjectInstancesRenderTimeout yöntemleri gereklidir.

abstract class VisualBuilderBase<T extends IVisual> {
    element: JQuery;
    viewport: IViewport;
    visualHost: IVisualHost;
    protected visual: T;
    constructor(width?: number, height?: number, guid?: string, element?: JQuery);
    protected abstract build(options: VisualConstructorOptions): T;
     nit(): void;
    destroy(): void;
    update(dataView: DataView[] | DataView): void;
    updateRenderTimeout(dataViews: DataView[] | DataView, fn: Function, timeout?: number): number;
    updateEnumerateObjectInstancesRenderTimeout(dataViews: DataView[] | DataView, options: EnumerateVisualObjectInstancesOptions, fn: (enumeration: VisualObjectInstance[]) => void, timeout?: number): number;
    updateFlushAllD3Transitions(dataViews: DataView[] | DataView): void;
    updateflushAllD3TransitionsRenderTimeout(dataViews: DataView[] | DataView, fn: Function, timeout?: number): number;
    enumerateObjectInstances(options: EnumerateVisualObjectInstancesOptions): VisualObjectInstance[];
}

DataViewBuilder

TestDataViewBuilder tarafından kullanılan bu modül, yönteminde createCategoricalDataViewBuilder kullanılan bir CategoricalDataViewBuilder sınıfı sağlar. Ayrıca birim testlerinde sahte DataView ile çalışmak için gereken arabirimleri ve yöntemleri belirtir.

  • withValues statik seri sütunları ekler ve withGroupedValues dinamik seri sütunları ekler.

    Görsel DataViewCategorical içinde hem dinamik seri hem de statik seri uygulamayın. Her ikisini de yalnızca DataViewCategorical sorgusunda kullanabilirsiniz. DataViewTransform'un bunları ayrı görsel DataViewCategorical nesnelerine bölmesi beklenir.

  • buildmeta veriler ve DataViewCategorical ile DataView döndürür.

    build, visual DataView oluşturulurken hem dinamik hem de statik seriler dahil olmak üzere parametrelerin bileşimi geçersizse Undefined döndürür.

class CategoricalDataViewBuilder implements IDataViewBuilderCategorical {
    withCategory(options: DataViewBuilderCategoryColumnOptions): IDataViewBuilderCategorical;
    withCategories(categories: DataViewCategoryColumn[]): IDataViewBuilderCategorical;
    withValues(options: DataViewBuilderValuesOptions): IDataViewBuilderCategorical;
    withGroupedValues(options: DataViewBuilderGroupedValuesOptions): IDataViewBuilderCategorical;
    build(): DataView;
}

function createCategoricalDataViewBuilder(): IDataViewBuilderCategorical;

TestDataViewBuilder

Birim testlerinde VisualData oluşturma için kullanılır. Veriler veri alanı demetlerine yerleştirildiğinde Power BI, verileri temel alan kategorik bir DataView nesnesi oluşturur. TestDataViewBuilder, kategorik DataView oluşturma işleminin benzetimini oluşturmaya yardımcı olur.

abstract class TestDataViewBuilder {
    static DataViewName: string;
    private aggregateFunction;
    static setDefaultQueryName(source: DataViewMetadataColumn): DataViewMetadataColumn;
    static getDataViewBuilderColumnIdentitySources(options: TestDataViewBuilderColumnOptions[] | TestDataViewBuilderColumnOptions): DataViewBuilderColumnIdentitySource[];
    static getValuesTable(categories?: DataViewCategoryColumn[], values?: DataViewValueColumn[]): any[][];
    static createDataViewBuilderColumnOptions(categoriesColumns: (TestDataViewBuilderCategoryColumnOptions | TestDataViewBuilderCategoryColumnOptions[])[], valuesColumns: (DataViewBuilderValuesColumnOptions | DataViewBuilderValuesColumnOptions[])[], filter?: (options: TestDataViewBuilderColumnOptions) => boolean, customizeColumns?: CustomizeColumnFn): DataViewBuilderAllColumnOptions;
    static setUpDataViewBuilderColumnOptions(options: DataViewBuilderAllColumnOptions, aggregateFunction: (array: number[]) => number): DataViewBuilderAllColumnOptions;
    static setUpDataView(dataView: DataView, options: DataViewBuilderAllColumnOptions): DataView;
    protected createCategoricalDataViewBuilder(categoriesColumns: (TestDataViewBuilderCategoryColumnOptions | TestDataViewBuilderCategoryColumnOptions[])[], valuesColumns: (DataViewBuilderValuesColumnOptions | DataViewBuilderValuesColumnOptions[])[], columnNames: string[], customizeColumns?: CustomizeColumnFn): IDataViewBuilderCategorical;
    abstract getDataView(columnNames?: string[]): DataView;
}

Aşağıda, oluştururken testDataViewen sık kullanılan arabirimler listelenir:

interface TestDataViewBuilderColumnOptions extends DataViewBuilderColumnOptions {
    values: any[];
}

interface TestDataViewBuilderCategoryColumnOptions extends TestDataViewBuilderColumnOptions {
    objects?: DataViewObjects[];
    isGroup?: boolean;
}

interface DataViewBuilderColumnOptions {
    source: DataViewMetadataColumn;
}

interface DataViewBuilderSeriesData {
    values: PrimitiveValue[];
    highlights?: PrimitiveValue[];
    /** Client-computed maximum value for a column. */
    maxLocal?: any;
    /** Client-computed maximum value for a column. */
    minLocal?: any;
}

interface DataViewBuilderColumnIdentitySource {
    fields: any[];
    identities?: CustomVisualOpaqueIdentity[];
}

Sahte uygulamalar

MockIVisualHost

Power BI çerçevesi gibi dış bağımlılıklar olmadan Power BI görsellerini test etmek için IVisualHost uygular.

Yararlı yöntemler arasında , createSelectionManager, createLocalizationManagerve getter özellikleri bulunurcreateSelectionIdBuilder.

import powerbi from "powerbi-visuals-api";

import VisualObjectInstancesToPersist = powerbi.VisualObjectInstancesToPersist;
import ISelectionIdBuilder = powerbi.visuals.ISelectionIdBuilder;
import ISelectionManager = powerbi.extensibility.ISelectionManager;
import IColorPalette = powerbi.extensibility.IColorPalette;
import IVisualEventService = powerbi.extensibility.IVisualEventService;
import ITooltipService = powerbi.extensibility.ITooltipService;
import IVisualHost = powerbi.extensibility.visual.IVisualHost;

class MockIVisualHost implements IVisualHost {
      constructor(
          colorPalette?: IColorPalette,
          selectionManager?: ISelectionManager,
          tooltipServiceInstance?: ITooltipService,
          localeInstance?: MockILocale,
          allowInteractionsInstance?: MockIAllowInteractions,
          localizationManager?: powerbi.extensibility.ILocalizationManager,
          telemetryService?: powerbi.extensibility.ITelemetryService,
          authService?: powerbi.extensibility.IAuthenticationService,
          storageService?: ILocalVisualStorageService,
          eventService?: IVisualEventService);
      createSelectionIdBuilder(): ISelectionIdBuilder;
      createSelectionManager(): ISelectionManager;
      createLocalizationManager(): ILocalizationManager;
      colorPalette: IColorPalette;
      locale: string;
      telemetry: ITelemetryService;
      tooltipService: ITooltipService;
      allowInteractios: boolean;
      storageService: ILocalVisualStorageService;
      eventService: IVisualEventService;
      persistProperties(changes: VisualObjectInstancesToPersist): void;
}
  • createVisualHost, aslında MockIVisualHost olan bir IVisualHost örneği oluşturur ve döndürür.

    function createVisualHost(locale?: Object, allowInteractions?: boolean, colors?: IColorInfo[], isEnabled?: boolean, displayNames?: any, token?: string): IVisualHost;
    

    Örnek:

    import { createVisualHost } from "powerbi-visuals-utils-testutils"
    
    let host: IVisualHost = createVisualHost();
    

Önemli

MockIVisualHost, IVisualHost'un sahte bir uygulamasıdır ve yalnızca birim testleriyle kullanılmalıdır.

MockIColorPalette

Power BI çerçevesi gibi dış bağımlılıklar olmadan Power BI görsellerini test etmek için IColorPalette uygular.

MockIColorPalette , birim testlerinde renk şemasını veya yüksek karşıtlık modunu denetlemek için kullanışlı özellikler sağlar.

import powerbi from "powerbi-visuals-api";
import IColorPalette = powerbi.extensibility.ISandboxExtendedColorPalette;
import IColorInfo = powerbi.IColorInfo;

class MockIColorPalette implements IColorPalette {
    constructor(colors?: IColorInfo[]);
    getColor(key: string): IColorInfo;
    reset(): IColorPalette;
    isHighContrastMode: boolean;
    foreground: {value: string};
    foregroundLight: {value: string};
    ...
    background: {value: string};
    backgroundLight: {value: string};
    ...
    shapeStroke: {value: string};
}
  • createColorPaletteaslında MockIColorPalette olan IColorPalette örneğini oluşturur ve döndürür.

    function createColorPalette(colors?: IColorInfo[]): IColorPalette;
    

    Örnek:

    import { createColorPalette } from "powerbi-visuals-utils-testutils"
    
    let colorPalette: IColorPalette = createColorPalette();
    

Önemli

MockIColorPalette, IColorPalette'in sahte bir uygulamasıdır ve yalnızca birim testleriyle kullanılmalıdır.

MockISelectionId

Power BI çerçevesi gibi dış bağımlılıklar olmadan Power BI görsellerini test etmek için ISelectionId uygular.

import powerbi from "powerbi-visuals-api";
import Selector = powerbi.data.Selector;
import ISelectionId = powerbi.visuals.ISelectionId;

class MockISelectionId implements ISelectionId {
    constructor(key: string);
    equals(other: ISelectionId): boolean;
    includes(other: ISelectionId, ignoreHighlight?: boolean): boolean;
    getKey(): string;
    getSelector(): Selector;
    getSelectorsByColumn(): Selector;
    hasIdentity(): boolean;
}
  • createSelectionId, aslında MockISelectionId olan bir ISelectionId örneği oluşturur ve döndürür.

    function createSelectionId(key?: string): ISelectionId;
    

    Örnek:

    import { createColorPalette } from "powerbi-visuals-utils-testutils"
    
    let selectionId: ISelectionId = createSelectionId();
    

Not

MockISelectionId, ISelectionId'nin sahte bir uygulamasıdır ve yalnızca birim testleriyle kullanılmalıdır.

MockISelectionIdBuilder

Power BI çerçevesi gibi dış bağımlılıklar olmadan Power BI görsellerini test etmek için ISelectionIdBuilder uygular.

import DataViewCategoryColumn = powerbi.DataViewCategoryColumn;
import DataViewValueColumn = powerbi.DataViewValueColumn;
import DataViewValueColumnGroup = powerbi.DataViewValueColumnGroup;
import DataViewValueColumns = powerbi.DataViewValueColumns;
import ISelectionIdBuilder = powerbi.visuals.ISelectionIdBuilder;
import ISelectionId = powerbi.visuals.ISelectionId;

class MockISelectionIdBuilder implements ISelectionIdBuilder {
    withCategory(categoryColumn: DataViewCategoryColumn, index: number): this;
    withSeries(seriesColumn: DataViewValueColumns, valueColumn: DataViewValueColumn | DataViewValueColumnGroup): this;
    withMeasure(measureId: string): this;
    createSelectionId(): ISelectionId;
    withMatrixNode(matrixNode: DataViewMatrixNode, levels: DataViewHierarchyLevel[]): this;
    withTable(table: DataViewTable, rowIndex: number): this;
}
  • createSelectionIdBuilder, aslında MockISelectionIdBuilder olan bir ISelectionIdBuilder örneği oluşturur ve döndürür.

    function createSelectionIdBuilder(): ISelectionIdBuilder;
    

    Örnek:

    import { selectionIdBuilder } from "powerbi-visuals-utils-testutils";
    
    let selectionIdBuilder = createSelectionIdBuilder();
    

Not

MockISelectionIdBuilder, ISelectionIdBuilder'ın sahte bir uygulamasıdır ve yalnızca birim testleriyle kullanılmalıdır.

MockISelectionManager

Power BI çerçevesi gibi dış bağımlılıklar olmadan Power BI görsellerini test etmek için ISelectionManager uygular.

import powerbi from "powerbi-visuals-api";
import IPromise = powerbi.IPromise;
import ISelectionId = powerbi.visuals.ISelectionId;
import ISelectionManager = powerbi.extensibility.ISelectionManager;

class MockISelectionManager implements ISelectionManager {
    select(selectionId: ISelectionId | ISelectionId[], multiSelect?: boolean): IPromise<ISelectionId[]>;
    hasSelection(): boolean;
    clear(): IPromise<{}>;
    getSelectionIds(): ISelectionId[];
    containsSelection(id: ISelectionId): boolean;
    showContextMenu(selectionId: ISelectionId, position: IPoint): IPromise<{}>;
    registerOnSelectCallback(callback: (ids: ISelectionId[]) => void): void;
    simutateSelection(selections: ISelectionId[]): void;
}
  • createSelectionManager, aslında MockISelectionManager olan ISelectionManager örneğini oluşturur ve döndürür.

    function createSelectionManager(): ISelectionManager
    

    Örnek:

    import { createSelectionManager } from "powerbi-visuals-utils-testutils";
    
    let selectionManager: ISelectionManager = createSelectionManager();
    

Not

MockISelectionManager, ISelectionManager'ın sahte bir uygulamasıdır ve yalnızca birim testleriyle kullanılmalıdır.

MockILocale

Birim testi işlemi sırasında yerel ayarı ayarlar ve gereksinimlerinize göre değiştirir.

class MockILocale {
    constructor(locales?: Object): void; // Default locales are en-US and ru-RU 
    locale(key: string): void;// setter property
    locale(): string; // getter property
}
  • createLocalebir MockILocale örneği oluşturur ve döndürür.
    funciton createLocale(locales?: Object): MockILocale;
    

MockITooltipService

Bir birim testi işlemi sırasında gereksinimleriniz için benzetimini TooltipService yapıp çağırır.

class MockITooltipService implements ITooltipService {
    constructor(isEnabled: boolean = true);
    enabled(): boolean;
    show(options: TooltipShowOptions): void;
    move(options: TooltipMoveOptions): void;
    hide(options: TooltipHideOptions): void;
}
  • createTooltipServicebir MockITooltipService örneği oluşturur ve döndürür.
    function createTooltipService(isEnabled?: boolean): ITooltipService;
    

MockIAllowInteractions

export class MockIAllowInteractions {
    constructor(public isEnabled?: boolean); // false by default
}
  • createAllowInteractionsbir MockIAllowInteractions örneği oluşturur ve döndürür.
    function createAllowInteractions(isEnabled?: boolean): MockIAllowInteractions;
    

MockILocalizationManager

Birim testi için gereken LocalizationManager'ın temel özelliklerini sağlar.

class MockILocalizationManager implements ILocalizationManager {
    constructor(displayNames: {[key: string]: string});
    getDisplayName(key: string): string; // returns default or setted displayNames for localized elements
}
  • createLocalizationManageraslında MockILocalizationManager olan ILocalizationManager örneğini oluşturur ve döndürür.

    function createLocalizationManager(displayNames?: any): ILocalizationManager;
    

    Örnek:

    import { createLocalizationManager } from "powerbi-visuals-utils-testutils";
    let localizationManagerMock: ILocalizationManager = createLocalizationManager();
    

MockITelemetryService

TelemetriHizmet kullanımını simüle eder.

class MockITelemetryService implements ITelemetryService {
    instanceId: string;
    trace(veType: powerbi.VisualEventType, payload?: string) {
    }
}

Oluşturma MockITelemetryServicetypescript function createTelemetryService(): ITelemetryService;

MockIAuthenticationService

Sahte bir Microsoft Entra belirteci sağlayarak AuthenticationService'in çalışmasının benzetimini gerçekleştirir.

class MockIAuthenticationService implements IAuthenticationService  {
    constructor(token: string);
    getAADToken(visualId?: string): powerbi.IPromise<string>
}
  • createAuthenticationServiceaslında MockIAuthenticationService olan IAuthenticationService örneğini oluşturur ve döndürür.
    function createAuthenticationService(token?: string): IAuthenticationService;
    

MockIStorageService

ILocalVisualStorageService'i LocalStorage ile aynı davranışla kullanmanıza olanak tanır.

class MockIStorageService implements ILocalVisualStorageService {
  get(key: string): IPromise<string>;
  set(key: string, data: string): IPromise<number>;
  remove(key: string): void;
}
  • createStorageServiceaslında MockIStorageService olan ILocalVisualStorageService örneğini oluşturur ve döndürür.
    function createStorageService(): ILocalVisualStorageService;
    

MockIEventService

import powerbi from "powerbi-visuals-api";
import IVisualEventService = powerbi.extensibility.IVisualEventService;
import VisualUpdateOptions = powerbi.extensibility.VisualUpdateOptions;

class MockIEventService implements IVisualEventService {
      renderingStarted(options: VisualUpdateOptions): void;
      renderingFinished(options: VisualUpdateOptions): void;
      renderingFailed(options: VisualUpdateOptions, reason?: string): void;
}
  • createEventService, aslında MockIEventService olan bir IVisualEventService örneği oluşturur ve döndürür.
    function createEventService(): IVisualEventService;
    

Yardımcı Programlar

Yardımcı programlar, Power BI görsellerinin birim testi için renkler, sayılar ve olaylarla ilgili yardımcılar da dahil olmak üzere yardımcı yöntemleri içerir.

  • renderTimeout bir zaman aşımı döndürür.

    function renderTimeout(fn: Function, timeout: number = DefaultWaitForRender): number
    
  • testDom birim testlerinde bir fikstür ayarlamaya yardımcı olur.

    function testDom(height: number | string, width: number | string): JQuery
    

    Örnek:

    import { testDom }  from "powerbi-visuals-utils-testutils";
    describe("testDom", () => {
        it("should return an element", () => {
            let element: JQuery = testDom(500, 500);
            expect(element.get(0)).toBeDefined();
        });
    });
    
  • getSolidColorStructuralObject

    function getSolidColorStructuralObject(color: string): any
    

    Aşağıdaki yapıyı döndürür:

    { solid: { color: color } }
    
  • assertColorsMatchgiriş dizelerinden ayrıştırılan RgbColor nesnelerini karşılaştırır.

    function assertColorsMatch(actual: string, expected: string, invert: boolean = false): boolean
    
  • parseColorStringgiriş dizesindeki rengi ayrıştırarak belirtilen RgbColor arabiriminde döndürür.

    function parseColorString(color: string): RgbColor
    
  • getRandomNumbers min ve max değerlerini kullanarak rastgele bir sayı oluşturur. Sonuç değişikliği için bir işlev belirtebilir exceptionList ve sağlayabilirsiniz.

    function getRandomNumber(
        min: number,
        max: number,
        exceptionList?: number[],
        changeResult: (value: any) => number = x => x): number
    
  • getRandomNumbers , belirtilen min ve max değerleriyle yöntemi tarafından getRandomNumber oluşturulan rastgele sayıların bir dizisini sağlar.

    function getRandomNumbers(count: number, min: number = 0, max: number = 1): number[]
    

Aşağıdaki yöntemler, birim testlerinde web sayfası olay benzetimi için yazılmıştır.

  • clickElement belirtilen öğeye bir tıklama benzetimi sağlar.

    function clickElement(element: JQuery, ctrlKey: boolean = false): void
    
  • createTouch bir dokunma olayının simülasyonunu yapmaya yardımcı olmak için bir Touch nesnesi döndürür.

    function createTouch(x: number, y: number, element: JQuery, id: number = 0): Touch
    
  • createTouchesList sanal Dokunma olaylarının listesini döndürür.

    function createTouchesList(touches: Touch[]): TouchList
    
  • createContextMenuEventMouseEvent döndürür.

    function createContextMenuEvent(x: number, y: number): MouseEvent
    
  • createMouseEvent, MouseEvent'i oluşturur ve döndürür.

    function createMouseEvent(
        mouseEventType: MouseEventType,
        eventType: ClickEventType,
        x: number,
        y: number,
        button: number = 0): MouseEvent
    
  • createTouchEndEvent

    function createTouchEndEvent(touchList?: TouchList): UIEvent
    
  • createTouchMoveEvent

    function createTouchMoveEvent(touchList?: TouchList): UIEvent
    
  • createTouchStartEvent

    function createTouchStartEvent(touchList?: TouchList): UIEvent
    

Birim testlerinde D3 olaylarının benzetimini yapmak için aşağıdaki yöntemler kullanılır.

  • flushAllD3Transitions tüm D3 geçişlerini tamamlamaya zorlar.

    function flushAllD3Transitions()
    

    Not

    Normalde, sıfır gecikmeli geçişler anlık bir gecikmeden (<10 ms) sonra yürütülür, ancak tarayıcı sayfayı iki kez işlerse bu kısa bir titremeye neden olabilir. İlk olay döngüsünün sonunda bir kez, ardından ilk zamanlayıcı geri çağırmada hemen yeniden.

    Bu titreşimler IE'de ve çok sayıda web görünümüyle daha belirgindir ve iOS için önerilmez.

    İlk olay döngüsünün sonunda zamanlayıcı kuyruğu temizleyerek, sıfır gecikmeli geçişleri hemen çalıştırabilir ve titremeyi önleyebilirsiniz.

Aşağıdaki yöntemler de dahildir:

function d3Click(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3MouseUp(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3MouseDown(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3MouseOver(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3MouseMove(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3MouseOut(element: JQuery, x: number, y: number, eventType?: ClickEventType, button?: number): void
function d3KeyEvent(element: JQuery, typeArg: string, keyArg: string, keyCode: number): void
function d3TouchStart(element: JQuery, touchList?: TouchList): void
function d3TouchMove(element: JQuery, touchList?: TouchList): void
function d3TouchEnd(element: JQuery, touchList?: TouchList): void
function d3ContextMenu(element: JQuery, x: number, y: number): void

Yardımcı arabirimler

Yardımcı işlevinde aşağıdaki arabirim ve numaralandırmalar kullanılır.

interface RgbColor {
    R: number;
    G: number;
    B: number;
    A?: number; 
}

enum ClickEventType {
    Default = 0,
    CtrlKey = 1,
    AltKey = 2,
    ShiftKey = 4,
    MetaKey = 8,
}

enum MouseEventType {
    click,
    mousedown,
    mouseup,
    mouseover,
    mousemove,
    mouseout,
}

Webpack tabanlı Power BI görselleri için birim testleri yazmak ve ve jasmineile karma birim testi yazmak için bkz. Öğretici: Power BI görsel projeleri için birim testleri ekleme.