/**
 * A graph draws its groups and comments again on every edit of the project, a stroke on a tilemap
 * included. A caption that is given a new style is drawn again as text, so it keeps its style for as
 * long as colour and width stay the same (#347).
 */
import type { Text } from 'pixi.js';
import { describe, expect, it } from 'vitest';
import { AnnotationView } from '../../src/editor/graph/AnnotationView';

const note = { id: 'n1', x: 0, y: 0, w: 200, h: 120, text: 'Comment' };
const captionOf = (view: AnnotationView) => view.children[1] as Text;

describe('the caption of a group or comment', () => {
  // A comment only: a group's title is cut to its width by measuring it, which needs a canvas. The
  // groups are seen in the browser, in e2e 40c-iii.
  it('keeps its style through a redraw that changes nothing', () => {
    const view = new AnnotationView({ ...note }, 'note');
    const style = captionOf(view).style;
    view.redraw();
    view.sync({ ...note });
    expect(captionOf(view).style).toBe(style);
  });

  it('is given a new style for a new width or colour', () => {
    const view = new AnnotationView({ ...note }, 'note');
    const style = captionOf(view).style;
    view.sync({ ...note, w: 260 });
    const wider = captionOf(view).style;
    expect(wider).not.toBe(style);
    expect(wider.wordWrapWidth).toBe(260 - 16);
    view.sync({ ...note, w: 260, color: 0xffffff });
    expect(captionOf(view).style).not.toBe(wider);
    expect(captionOf(view).style.fill).not.toBe(wider.fill);
  });
});