Телеграмм чат группы frontendua страница 1761

Кажтся работает

19:53пожаловаться #1

Зато кажется наткнулся на ограничение jsdom — он не умеет кастомные проперди:

test.skip("render consumer avatar", () => {
    const { root } = renderComponent({
      size: "m",
      alt: "avatar",
      userType: UserTypes.CONSUMER,
      style: {
        "--ds-colors-violet60": "red",
        "--ds-colors-blue60": "blue",
      },
    });
    const styles = window.getComputedStyle(root);
    const color = styles.getPropertyValue("background");
    expect(color).toBe("red");
  });

И вот тут уже наверное ничего не придумаешь.
Единственная разница от пропердли userType — цвет фона.
И его из за кастомных пропердей никак не проверить…

19:54пожаловаться #2

Serhey Shmyg in Frontend UA

Anton Nemtsev

Зато кажется наткнулся на ограничение jsdom — он не умеет кастомные проперди:

test.skip("render consumer avatar", () => {
    const { root } = renderComponent({
      size: "m",
      alt: "avatar",
      userType: UserTypes.CONSUMER,
      style: {
        "--ds-colors-violet60": "red",
        "--ds-colors-blue60": "blue",
      },
    });
    const styles = window.getComputedStyle(root);
    const color = styles.getPropertyValue("background");
    expect(color).toBe("red");
  });

Загалаом тестити стилі так собі ідея.

Вт

Зато кажется наткнулся на ограничение jsdom — он не умеет кастомные проперди:

test.skip("render consumer avatar", () => {
    const { root } = renderComponent({
      size: "m",
      alt: "avatar",
      userType: UserTypes.CONSUMER,
      style: {
        "--ds-colors-violet60": "red",
        "--ds-colors-blue60": "blue",
      },
    });
    const styles = window.getComputedStyle(root);
    const color = styles.getPropertyValue("background");
    expect(color).toBe("red");
  });

И шедоу дом не умеет

21:11пожаловаться #4

R🔘

Serhey Shmyg

Загалаом тестити стилі так собі ідея.

Снепшоты можно делать

21:12пожаловаться #5

Serhey Shmyg

Загалаом тестити стилі так собі ідея.

А как иначе проверить то, работает ли проп, если всё что он делает — меняет цвет фона?

21:15пожаловаться #6

Roman 🔘

Снепшоты можно делать

Снепшоты про html же вроде?
Ну и у нас их всё равно запретили.

21:16пожаловаться #7

R🔘

Anton Nemtsev

Снепшоты про html же вроде?
Ну и у нас их всё равно запретили.

Снепшотить html порочная практика, можно снепшотить отрендеренный UI в сторибуке например

21:30пожаловаться #8

R🔘

Там есть грабли и ньюансы, но выглядит как единственный спсоб отслеживать регрессии UI

21:31пожаловаться #9

А что значит "снепшотить отрендеренный UI в сторибуке"?
Можно какие то референсы, что бы почитать?

21:43пожаловаться #10

у нас скриншоты сверяют из сторибука, ты про это?

21:44пожаловаться #11

R🔘

Using Storybook as a Visual Testing Platform

Anton Nemtsev

А что значит "снепшотить отрендеренный UI в сторибуке"?
Можно какие то референсы, что бы почитать?

https://emasuriano.com/blog/using-storybook-as-a-visual-testing-platform

visual testing называется

Ema Suriano

My experience working with this strategy of testing (which does not replace the others) and the integration with my current development tool.

21:51пожаловаться #12

R🔘

что то такое

21:51пожаловаться #13

как это связано с фронтендом?

22:56пожаловаться #14

sho? in Frontend UA

никак. Это спам.

22:58пожаловаться #15

sho? in Frontend UA

зовите админа же

22:58пожаловаться #16

понимаю)

22:59пожаловаться #17

Ребят, есть тут гуру ангуляра? Вопрос чисто ангуляровский. Есть компонент A, который в шаблонах не вызывается нигде, рендерится потом динамически вручную.
Он импортится только в главный файл app.module.ts. В блок declarations.
Так вот этот компонент не попадает в продакшн бандл. Он "оптимизируется" и ангуляр считает что он в бандле не нужон

23:02пожаловаться #18

entryComponents помечен как deprecated в 9-м ангуляре и не работает

23:03пожаловаться #19

Using Storybook as a Visual Testing Platform

Roman 🔘

https://emasuriano.com/blog/using-storybook-as-a-visual-testing-platform

visual testing называется

Ema Suriano

My experience working with this strategy of testing (which does not replace the others) and the integration with my current development tool.

А, да, это есть.