feat: retry tests with checkboxes #453

KuznetsovRoman · 2022-12-30T06:48:11Z

No description provided.

KuznetsovRoman

Что сделано

Добавил чекбоксы на:

браузеры
сьюты
группы

У чекбоксов три состояния: "Выбрано", "Не выбрано", "Выбрано частично"

Чекбоксы отжимаются, когда изменяется режим просмотра (фильтр по имени теста, по браузеру, по статусу, группировка), также обновляется статус чекбоксов (ex: полу-выбранный может стать выбранным, если в текущем режиме просмотра все его дети выбраны)

Также изменил кнопку запуска, теперь в ней совмещены три режима: "Запустить (все|выбранные|проваленные) тесты"

Принятые решения

Отключил чекбоксы пока в статике, так как там они не делают ничего.

Скриншоты

KuznetsovRoman · 2023-01-13T11:01:46Z

lib/static/components/controls/common-filters.js

@@ -21,12 +22,13 @@ class CommonFilters extends Component {
                />
                <TestNameFilterInput/>
                <StrictMatchFilterInput/>
+                {gui && <ShowCheckboxesInput/>}


Затычка, чтобы убрать чекбоксы из статического отчета.

Добавил, потому что пока от этих чекбоксов в статическом отчете никакого толку нет.

Чтобы чекбоксы в статике заработали, достаточно просто убрать вот это вот условие

KuznetsovRoman · 2023-01-13T11:02:36Z

lib/static/components/controls/gui-controls.js

-        processing: PropTypes.bool.isRequired,
-        stopping: PropTypes.bool.isRequired,
-        autoRun: PropTypes.bool.isRequired,
-        allRootSuiteIds: PropTypes.arrayOf(PropTypes.string).isRequired,
-        failedRootSuiteIds: PropTypes.arrayOf(PropTypes.string).isRequired,
-        failedTests: PropTypes.arrayOf(PropTypes.shape({
-            testName: PropTypes.string,
-            browserName: PropTypes.string
-        })).isRequired
-    }
-
-    _runFailedTests = () => {
-        const {actions, failedTests} = this.props;
-
-        return actions.runFailedTests(failedTests);


Вот это вот все унес под кнопку <RunButton />

KuznetsovRoman · 2023-01-13T11:03:52Z

lib/static/components/controls/run-button/index.js

+const RunMode = Object.freeze({
+    ALL: 'All',
+    FAILED: 'Failed',
+    CHECKED: 'Checked'
+});


Что-то типа Enum

KuznetsovRoman · 2023-01-13T11:06:26Z

lib/static/components/controls/run-button/index.js

+    const shouldShowFailed = !!failedTests.length;
+    const shouldShowChecked = showCheckboxes && !!checkedTests.length;
+    const shouldShowPopup = !isDisabled && (shouldShowFailed || shouldShowChecked);


Отображаем:

вариант Failed если упавшие тесты есть

вариант Checked если выбран соответствующий режим и есть выбранные тесты

сам попап, если помимо All доступен хоть один вариант выше

KuznetsovRoman · 2023-01-13T11:08:00Z

lib/static/components/controls/run-button/index.js

+    useEffect(() => {
+        const pickedEmptyFailed = mode === RunMode.FAILED && !shouldShowFailed;
+        const pickedEmptyChecked = mode === RunMode.CHECKED && !shouldShowChecked;
+
+        if (pickedEmptyFailed || pickedEmptyChecked) {
+            setMode(RunMode.ALL);
+        }
+    }, [shouldShowFailed, shouldShowChecked]);


Скидываем режим до All, если текущий выбранный вариант пропал. Такое бывает, если:

Перезапустили упавшие тесты, и они прошли

Отключили чекбоксы

Анчекнули все тесты

KuznetsovRoman · 2023-01-13T12:57:09Z

lib/static/modules/reducers/tree/nodes/suites.js

+export function updateParentsChecked(tree, parentIds) {
+    const youngerSuites = [].concat(parentIds)
+        .filter(parentId => parentId)
+        .map((suiteId) => tree.suites.byId[suiteId]);
+
+    const changeParentSuiteCb = (parentSuite) => {
+        changeSuiteState(tree, parentSuite.id, {shouldBeChecked: shouldSuiteBeChecked(parentSuite, tree)});
+    };
+
+    youngerSuites.forEach(changeParentSuiteCb);
+
+    calcParentSuitesState(youngerSuites, tree, changeParentSuiteCb);
+}


Заиспользовал имеющуюся функцию calcParentSuitesState, но первый слой сьютов, который имеет браузеры, оно не обрабатывает, поэтому по ним проходимся вручную

UPD: shouldBeChecked -> checkStatus

KuznetsovRoman · 2023-01-13T12:58:06Z

lib/static/modules/reducers/tree/nodes/suites.js

@@ -33,6 +35,20 @@ export function updateSuitesStatus(tree, suites) {
    });
 }

+export function updateParentsChecked(tree, parentIds) {
+    const youngerSuites = [].concat(parentIds)
+        .filter(parentId => parentId)


До этого фильтра тут еще могут оказаться null-ы

KuznetsovRoman · 2023-01-13T13:00:15Z

lib/static/modules/reducers/tree/nodes/suites.js

+    return checkedChildCount && checkedChildCount < childCount
+        ? undefined
+        : checkedChildCount === childCount;


Если выбрано не нулевое количество детей, но не все, то ставим сьюту undefined.

UPD:

return Number((checkedChildCount === childCount) || (checkedChildCount && INDETERMINATE));

KuznetsovRoman · 2023-01-13T13:02:15Z

lib/static/styles.css

-    width: 16px;
+    width: 18px;


Чекбоксы изначально 17х17. Чтобы не дергалось при их включении/выключании, поставил всем ширину в 18 пикселей.

KuznetsovRoman · 2023-01-13T13:09:00Z

test/unit/lib/static/components/section/section-browser.js

    describe('skipped test', () => {
-        it('should render "[skipped]" tag in title', () => {
+        it('should pass "[skipped]" tag in title', () => {
            const browsersById = mkBrowser({id: 'yabro-1', name: 'yabro', resultIds: ['res'], parentId: 'test'});
            const browsersStateById = {'yabro-1': {shouldBeShown: true, shouldBeOpened: false}};
            const resultsById = mkResult({id: 'res', status: SKIPPED});
            const tree = mkStateTree({browsersById, browsersStateById, resultsById});

-            const component = mkSectionBrowserComponent({browserId: 'yabro-1'}, {tree});
+            mkSectionBrowserComponent({browserId: 'yabro-1'}, {tree});

-            assert.equal(component.find('.section__title_skipped').first().text(), `[${SKIPPED}] yabro`);
+            assert.calledWithMatch(
+                BrowserSkippedTitle,
+                set({}, 'title.props.children', [`[${SKIPPED}] `, 'yabro', undefined, undefined])
+            );
        });


В этом файле тестировался по сути <BrowserTitle/> компонент.
Это мешало, потому что <BrowserTitle/> теперь обращается к localStorage по хуку useLocalStorage, и тут нужно было либо перестать тестировать ребенка, либо передавать сюда в proxyquire <BrowserTitle/> с застабанным useLocalStorage. Выбрал первый вариант, кажется, так правильнее. Тесты ребенка перенес в отдельный файл, а тут застабал и проверяю, с каким тайтлом он вызывается.

Там в качестве title - React.Fragment, поэтому через массив:
['[skipped]', <browser>, ' reason ', <reason>]

KuznetsovRoman · 2023-03-14T22:44:33Z

lib/constants/checked-statuses.js

+module.exports = {
+    UNCHECKED: 0,
+    INDETERMINATE: 0.5,
+    CHECKED: 1
+};


Сначала были checked / unchecked - true / false, соответственно. Потом появились indeterminate. Булевых значений всего два, поэтому и есть этот enum. Тип - число, потому что так удобнее считать.

KuznetsovRoman · 2023-03-16T10:33:15Z

Подвинул линию у неопределенных чекбоксов на пол пикселя вниз

sipayRT

последние тесты на редьюсеры получились прям сложными (но я сходу не придумал как их упростить)

Еще режет глаз постоянные Number(!checkStatus). очень легко запутаться

в остальном норм (но я еще в живую потыкаю)

upd: в попапе не хватает разделителей между режимами. сейчас слова как будто подвешены в воздухе

sipayRT · 2023-05-15T09:49:16Z

lib/static/components/controls/run-button/index.styl

+    }
+
+    .run-button__dropdown {
+        font-family: Dropdown;


что это за ff такой?

Это специальный шрифт из semantic-ui-react для отображения этой стрелочки у Dropdown:

Заиспользовал его, чтобы не плодить лишних svg

sipayRT · 2023-05-15T09:49:32Z

lib/static/components/controls/run-button/index.js

+            {shouldShowPopup && <Popup
+                action='hover'
+                hideOnClick={true}
+                target={<span className='run-button__dropdown' />}


для чего это делается span-ом?

span по своей натуре строчный элемент, в то время как div - блочный. Может с div отображалось бы так же, но как будто семантически ближе именно span

span как раз больше для выделения конкретных частей текста (например, подсветить слово)

div будет вести себя так же. Но не критично

lib/static/components/controls/run-button/index.styl

sipayRT · 2023-06-22T09:38:03Z

lib/static/components/controls/run-button/index.js

+    checkedTests: PropTypes.arrayOf(PropTypes.shape({
+        testName: PropTypes.string,
+        browserName: PropTypes.string
+    })).isRequired


но ведь если у нас не включен режим чекбокса, то этого значения не будет. Или будет просто пустой массив?

Слайдер на чекбокс только переключает его отображение, и по сути выполняет чисто визуальную функцию. Если чекнуть какой-то тест, потом выключить чекбоксы, а потом включить обратно, то `checkedTests` сохранится. Так что тут если чекбоксы выключены, это просто будет пустым массивом

sipayRT · 2023-06-22T09:39:43Z

lib/static/components/controls/run-button/index.js

+    (state) => {
+        const autoRun = state.autoRun;
+        const allRootSuiteIds = state.tree.suites.allRootIds;
+        const processing = state.processing;


чем у нас processing отличается от running?

processing не обязательно running. processing может быть принятие скриншота

sipayRT · 2023-06-22T13:09:38Z

test/unit/lib/static/components/controls/run-button.js

+        useLocalStorageStub = sandbox.stub().returns([true]);
+        actionsStub = {
+            runAllTests: sandbox.stub().returns({type: 'some-type'}),
+            runFailedTests: sandbox.stub().returns({type: 'some-type'}),


зачем возвращать одинаковые значения для разных экшенов?

Нам абсолютно нет никакой разницы, что там за тип, главное, чтобы он был

В тестах нет никакой завязки на эти type, проверяется именно, что вызывается сама функция runAllTests, runFailedTests. Ну и такое возвращаемое значение застабано для всех экшенов в тестах: https://github.com/search?q=repo%3Agemini-testing%2Fhtml-reporter%20type%3A%20%27some-type%27&type=code

sipayRT · 2023-06-22T13:16:35Z

test/unit/lib/static/components/controls/run-button.js

+        const state = mkState({initialState: {tree: {suites: {allRootIds: ['suite']}}, processing: false}});
+        selectorsStub.getFailedTests.withArgs(state).returns(failedTests);
+        const component = mkConnectedComponent(<RunButton />, {state});
+        component.findWhere(node => node.type() === 'li' && node.text() === 'Failed').simulate('click');


а че, по value нельзя проще найти? или добавить data-атрибут в разметку

Не знал, что так можно. Заменил на component.find({children: 'Failed'}).simulate('click');

sipayRT · 2023-06-22T13:38:17Z

test/unit/lib/static/components/group-tests/item.js

+
+                const component = mkGroupTestsItemComponent();
+
+                assert.equal(component.find(Checkbox).exists(), +show);


чет я не понял. exists же булевое значение вернет

А зачем я тогда show к числу привел? Пофиксил

test/unit/lib/static/components/section/title/browser-skipped.js

sipayRT · 2023-06-22T13:44:17Z

test/unit/lib/static/components/section/title/browser.js

        }).default;
    });

+    describe('<Checkbox/>', () => {
+        [true, false].forEach(show => {
+            it(`should ${show ? '' : 'not '}exist if "showCheckboxes" is ${show ? '' : 'not '}set`, () => {


выше уже писал, что стОит вынести логику в общий компонент. у тебя и тесты дублируются теперь

sipayRT · 2023-06-22T14:07:47Z

Попробовал запустить упавшие тесты. Выбрал по одному тесту в разных сьютах. В итоге, тесты прошли (из попапа удалился пункт про упавшие тесты), а визуально выглядит как будто тесты еще выполняются

sipayRT · 2023-06-22T14:09:22Z

Я бы еще в попапе не удалял пункты, которых не может быть, а дизхейблил. Так будет сильно проще пользователю, т.к. он привыкает, что вторая строчка - это перезапуск упавших тестов, а там, вдруг, уже перезапуск выделенных тестов. Интерфейс должен оставаться постоянным

KuznetsovRoman · 2023-06-23T09:26:46Z

Попробовал запустить упавшие тесты. Выбрал по одному тесту в разных сьютах. В итоге, тесты прошли (из попапа удалился пункт про упавшие тесты), а визуально выглядит как будто тесты еще выполняются

Попробуй в development режиме, если получится воспроизвести, то в консоли должен быть лог редакса.

Визуально оно так выглядит, потому что tree.suites.byId[suiteId].status === "running"

Устанавливается он как раз через clientEvents эвентом TEST_BEGIN, после чего эвентом TEST_PASS после прохождения теста статус должен меняться

sipayRT · 2023-06-29T09:54:16Z

lib/static/components/controls/run-button/index.js

@@ -53,28 +53,47 @@ const RunButton = ({actions, autoRun, isDisabled, isRunning, failedTests, checke
    }, []);

    useEffect(() => {
-        const pickedEmptyFailed = mode === RunMode.FAILED && !shouldShowFailed;
-        const pickedEmptyChecked = mode === RunMode.CHECKED && !shouldShowChecked;
+        if (!shouldDisableChecked) {


у тебя здесь получается двойная проверка на shouldDisableChecked - сначала здесь, а потом и внутри функции selectCheckedTests

Убрал внутри useEffect, потому что disabled опции все равно могут получить клик

lib/static/components/controls/run-button/index.js

sipayRT · 2023-06-29T09:57:34Z

lib/static/components/controls/run-button/index.js

+            {shouldShowPopup && <Popup
+                action='hover'
+                hideOnClick={true}
+                target={<span className='run-button__dropdown' />}


span как раз больше для выделения конкретных частей текста (например, подсветить слово)

div будет вести себя так же. Но не критично

lib/static/components/controls/run-button/index.js

lib/static/components/bullet.js

test/unit/lib/static/components/bullet.js

lib/static/components/bullet.js

test/unit/lib/static/components/bullet.js

test/unit/lib/static/components/controls/run-button.js

KuznetsovRoman changed the title ~~feat: retry tests with checkboxes~~ [WIP] feat: retry tests with checkboxes Dec 30, 2022

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 10 times, most recently from 0786350 to fb59b5e Compare January 13, 2023 10:57

KuznetsovRoman changed the title ~~[WIP] feat: retry tests with checkboxes~~ feat: retry tests with checkboxes Jan 13, 2023

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 5 times, most recently from ce3b443 to 8e8ad44 Compare January 13, 2023 12:49

KuznetsovRoman commented Jan 13, 2023

View reviewed changes

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch from 8e8ad44 to 79fd55e Compare January 13, 2023 14:25

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch from 79fd55e to 01ff6ce Compare March 14, 2023 22:36

KuznetsovRoman commented Mar 14, 2023

View reviewed changes

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch from 208688c to 215bdf2 Compare March 16, 2023 10:40

sipayRT reviewed Jun 22, 2023

View reviewed changes

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 3 times, most recently from 50341a0 to a9b50e3 Compare June 23, 2023 09:18

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 2 times, most recently from 233cc01 to 4af63cd Compare June 23, 2023 15:44

KuznetsovRoman requested a review from sipayRT June 23, 2023 15:44

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 3 times, most recently from c0e184e to a3cb944 Compare June 27, 2023 17:50

sipayRT approved these changes Jul 3, 2023

View reviewed changes

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch 2 times, most recently from 91b28e8 to 9264ff0 Compare July 3, 2023 13:52

feat: retry tests with checkboxes

d3190c1

KuznetsovRoman force-pushed the HERMIONE-290.gui_checkbox branch from 9264ff0 to d3190c1 Compare July 3, 2023 14:01

KuznetsovRoman merged commit 665b80a into master Jul 3, 2023
4 checks passed

KuznetsovRoman deleted the HERMIONE-290.gui_checkbox branch July 3, 2023 14:03


		const component = mkGroupTestsItemComponent();

		assert.equal(component.find(Checkbox).exists(), +show);

feat: retry tests with checkboxes #453

feat: retry tests with checkboxes #453

Conversation

KuznetsovRoman commented Dec 30, 2022

KuznetsovRoman left a comment • edited Loading

Choose a reason for hiding this comment

Что сделано

Принятые решения

Скриншоты

Choose a reason for hiding this comment

KuznetsovRoman Jan 13, 2023 • edited Loading

Choose a reason for hiding this comment

KuznetsovRoman Jan 13, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

KuznetsovRoman commented Mar 16, 2023

sipayRT left a comment • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

sipayRT commented Jun 22, 2023

sipayRT commented Jun 22, 2023

KuznetsovRoman commented Jun 23, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

KuznetsovRoman left a comment •

edited

Loading

KuznetsovRoman Jan 13, 2023 •

edited

Loading

KuznetsovRoman Jan 13, 2023 •

edited

Loading

sipayRT left a comment •

edited

Loading

KuznetsovRoman commented Jun 23, 2023 •

edited

Loading