Как уменьшить размер указателя мыши в testcafe - PullRequest
0 голосов
/ 27 ноября 2018

Как уменьшить размер указателя мыши в testcafe .. Ниже приведен код, который я написал, но не работает ...

import { ClientFunction } from 'testcafe';
import { Selector } from 'testcafe';

fixture test
.page http://example.com
.beforeEach(async t => {
await disableCursor();
})

const disableCursor = ClientFunction(() => {
var styleElement = document.createElement('style');
styleElement.innerHTML = '.cursor-hammerhead-shadow-ui {width:10px; height:40px }';
document.head.appendChild(styleElement);
});

test('test', async t => {
await t.click(Selector('body > div > p:nth-child(3) > a'))
await t.click(Selector('#header > div.navigation > ul > li:nth-child(1) > a'))
});

1 Ответ

0 голосов
/ 27 ноября 2018

Чтобы уменьшить размер указателя мыши, выполните следующие действия:

  1. Укажите селектор курсора: #root-hammerhead-shadow-ui.root-hammerhead-shadow-ui .cursor-hammerhead-shadow-ui.
  2. Используйте флаг !important в свойствах CSS.

В результате приведенный ниже код заменяет курсор по умолчанию на красный квадрат:

const resizeCursor = ClientFunction(() => {
    var styleElement = document.createElement('style');
    styleElement.innerHTML = '#root-hammerhead-shadow-ui.root-hammerhead-shadow-ui .cursor-hammerhead-shadow-ui { background: red !important; width:40px !important; height:40px !important }';
    document.head.appendChild(styleElement);
});

Если вы хотите изменить курсор на собственное изображение, попробуйте следующее свойство CSS: background-image.

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

...