🔧 fix(DropdownButtonComponent): add id attribute to Button component to improve accessibility and testing capabilities

🔧 fix(floatComponent): add id attribute to Input component to improve accessibility and testing capabilities
🔧 fix(keypairListComponent): add id attribute to Input components to improve accessibility and testing capabilities
🔧 fix(keypairListComponent): add id attribute to Plus and Minus buttons to improve accessibility and testing capabilities
🔧 fix(toggleShadComponent): add id attribute to Switch component to improve accessibility and testing capabilities
🔧 fix(EditNodeModal): add id attribute to ToggleShadComponent component to improve accessibility and testing capabilities
🔧 fix(PageComponent): add id attribute to div element to improve accessibility and testing capabilities
🔧 fix(extraSidebarComponent): add id attribute to div element to improve accessibility and testing capabilities
🔧 fix(nodeToolbarComponent): add id attribute to div element to improve accessibility and testing capabilities
🔧 fix(nodeToolbarComponent): add id attribute to button element to improve accessibility and testing capabilities
🔧 fix(types/components): add id attribute to ToggleComponentType to improve accessibility and testing capabilities

🚀 feat(keypair.spec.ts): add tests for KeypairListComponent to verify key-value pairs functionality
🚀 feat(float.spec.ts): add tests for FloatComponent to verify float input functionality

🚀 feat: add support for toggling various options in the UI

This commit adds support for toggling various options in the UI. The following options can now be toggled:
- showtemperature
- showtop_k
- showtop_p
- showuse_mlock
- showuse_mmap
- showverbose
- showvocab_only
- showcache
- showecho
- showf16_kv
- showgrammar_path
- showlast_n_tokens_size
- showlogits_all
- showlogprobs
- showlora_base
- showlora_path
- showmax_tokens
- showmetadata
- showmodel_kwargs
- showmodel_path
- shown_batch
- shown_ctx
- shown_gpu_layers
- shown_parts
- shown_threads
- showrepeat_penalty
- showrope_freq_base
- showrope_freq_scale
- showseed
- showstop
- showstreaming
- showsuffix
- showtags

These options can be toggled by clicking on the respective elements in the UI. The commit also includes tests to ensure that the toggling functionality works as expected.
This commit is contained in:
Cristhian Zanforlin Lousa 2023-10-02 21:45:48 -03:00 committed by anovazzi1
commit 9e2b73eac9
10 changed files with 498 additions and 17 deletions

View file

@ -21,6 +21,7 @@ export default function DropdownButton({
<DropdownMenu open={showOptions}>
<DropdownMenuTrigger asChild>
<Button
id="new-project-btn"
variant="primary"
className="relative pr-10"
onClick={(event) => {

View file

@ -23,6 +23,7 @@ export default function FloatComponent({
return (
<div className="w-full">
<Input
id="float-input"
type="number"
step={step}
min={min}

View file

@ -55,6 +55,7 @@ export default function KeypairListComponent({
return (
<div key={idx} className="flex w-full gap-2">
<Input
id={"keypair" + index}
type="text"
value={key.trim()}
className={classNames(
@ -72,6 +73,7 @@ export default function KeypairListComponent({
/>
<Input
id={"keypair" + (index + 100).toString()}
type="text"
value={obj[key]}
className={editNode ? "input-edit-node" : ""}
@ -88,6 +90,7 @@ export default function KeypairListComponent({
newInputList.push({ "": "" });
onChange(newInputList);
}}
id={"plusbtn" + index.toString()}
>
<IconComponent
name="Plus"
@ -101,6 +104,7 @@ export default function KeypairListComponent({
newInputList.splice(index, 1);
onChange(newInputList);
}}
id={"minusbtn" + index.toString()}
>
<IconComponent
name="X"

View file

@ -6,6 +6,7 @@ export default function ToggleShadComponent({
setEnabled,
disabled,
size,
id = "",
}: ToggleComponentType): JSX.Element {
let scaleX, scaleY;
switch (size) {
@ -29,6 +30,7 @@ export default function ToggleShadComponent({
return (
<div className={disabled ? "pointer-events-none cursor-not-allowed " : ""}>
<Switch
id={id}
style={{
transform: `scaleX(${scaleX}) scaleY(${scaleY})`,
}}

View file

@ -467,6 +467,11 @@ const EditNodeModal = forwardRef(
<TableCell className="p-0 text-right">
<div className="items-center text-center">
<ToggleShadComponent
id={
"show" +
myData.current.node?.template[templateParam]
.name
}
enabled={
!myData.current.node?.template[
templateParam
@ -492,6 +497,7 @@ const EditNodeModal = forwardRef(
<BaseModal.Footer>
<Button
id={"saveChangesBtn"}
className="mt-3"
onClick={() => {
const newData = cloneDeep(myData.current);

View file

@ -434,7 +434,7 @@ export default function Page({
<div className="h-full w-full" ref={reactFlowWrapper}>
{Object.keys(templates).length > 0 &&
Object.keys(types).length > 0 ? (
<div className="h-full w-full">
<div id="react-flow-id" className="h-full w-full">
<ReactFlow
nodes={nodes}
onMove={() => {

View file

@ -271,7 +271,13 @@ export default function ExtraSidebar(): JSX.Element {
);
}}
>
<div className="side-bar-components-div-form">
<div
className="side-bar-components-div-form"
id={
"side" +
data[SBSectionName][SBItemName].display_name
}
>
<span className="side-bar-components-text">
{data[SBSectionName][SBItemName].display_name}
</span>

View file

@ -138,7 +138,7 @@ export default function NodeToolbarComponent({
<Select onValueChange={handleSelectChange} value={selectedValue}>
<ShadTooltip content="More" side="top">
<SelectTrigger>
<div>
<div id="advancedIcon">
<div
className={classNames(
"relative -ml-px inline-flex h-8 w-[31px] items-center rounded-r-md bg-background text-foreground shadow-md ring-1 ring-inset ring-ring transition-all duration-500 ease-in-out hover:bg-muted focus:z-10" +
@ -163,6 +163,7 @@ export default function NodeToolbarComponent({
}
>
<div
id="editAdvancedBtn"
className={
"flex " +
(nodeLength == 0
@ -179,7 +180,7 @@ export default function NodeToolbarComponent({
</SelectItem>
{isMinimal && (
<SelectItem value={getRandomKeyByssmm() + "show"}>
<div className="flex">
<div className="flex" id="editAdvanced">
<IconComponent
name={showNode ? "Minimize2" : "Maximize2"}
className="relative top-0.5 mr-2 h-4 w-4"
@ -192,7 +193,7 @@ export default function NodeToolbarComponent({
</Select>
) : (
<ShadTooltip content="Edit" side="top">
<div>
<div id="editAdvancedIcon">
<button
disabled={nodeLength === 0}
onClick={() => setShowModalAdvanced(true)}

View file

@ -23,6 +23,7 @@ export type ToggleComponentType = {
setEnabled: (state: boolean) => void;
disabled: boolean | undefined;
size: "small" | "medium" | "large";
id?: string;
};
export type DropDownComponentType = {
value: string;
@ -136,18 +137,18 @@ export type TooltipComponentType = {
children: ReactElement;
title: string | ReactElement;
placement?:
| "bottom-end"
| "bottom-start"
| "bottom"
| "left-end"
| "left-start"
| "left"
| "right-end"
| "right-start"
| "right"
| "top-end"
| "top-start"
| "top";
| "bottom-end"
| "bottom-start"
| "bottom"
| "left-end"
| "left-start"
| "left"
| "right-end"
| "right-start"
| "right"
| "top-end"
| "top-start"
| "top";
};
export type ProgressBarType = {

View file

@ -0,0 +1,459 @@
import { expect, test } from "@playwright/test";
test("KeypairListComponent", async ({ page }) => {
await page.goto('http://localhost:3000/');
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.getByPlaceholder('Search').click();
await page.getByPlaceholder('Search').fill('csv');
await page.waitForTimeout(2000);
await page.locator('//*[@id="sideCSVLoader"]').dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.locator('//*[@id="keypair0"]').click();
await page.locator('//*[@id="keypair0"]').fill('testtesttesttest');
await page.locator('//*[@id="keypair100"]').click();
await page.locator('//*[@id="keypair100"]').fill('testtesttesttesttesttest');
const plusButtonLocatorNode = page.locator('//*[@id="plusbtn0"]');
const elementCountNode = await plusButtonLocatorNode.count();
if (elementCountNode > 0) {
await plusButtonLocatorNode.click();
}
await page.locator('//*[@id="keypair1"]').click();
await page.locator('//*[@id="keypair1"]').fill('testtesttesttest1');
await page.locator('//*[@id="keypair101"]').click();
await page.locator('//*[@id="keypair101"]').fill('testtesttesttesttesttest1');
await page.locator('//*[@id="plusbtn1"]').click();
await page.locator('//*[@id="keypair2"]').click();
await page.locator('//*[@id="keypair2"]').fill('testtesttesttest2');
await page.locator('//*[@id="keypair102"]').click();
await page.locator('//*[@id="keypair102"]').fill('testtesttesttesttesttest2');
await page.locator('//*[@id="minusbtn1"]').click();
const keyPairVerification = page.locator('//*[@id="keypair102"]');
const elementKeyCount = await keyPairVerification.count();
if (elementKeyCount === 0) {
expect(true).toBeTruthy();
} else {
expect(false).toBeTruthy();
}
await page.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div/div[1]/div').click();
await page.locator('//*[@id="advancedIcon"]').click();
await page.locator('//*[@id="editAdvancedBtn"]').click();
await page.locator('//*[@id="showfile_path"]').click();
expect(await page.locator('//*[@id="showfile_path"]').isChecked()).toBeFalsy();
await page.locator('//*[@id="showmetadata"]').click();
expect(await page.locator('//*[@id="showmetadata"]').isChecked()).toBeFalsy();
await page.locator('//*[@id="saveChangesBtn"]').click();
const plusButtonLocator = page.locator('//*[@id="plusbtn0"]');
const elementCount = await plusButtonLocator.count();
if (elementCount === 0) {
expect(true).toBeTruthy();
await page.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div/div[1]/div').click();
await page.locator('//*[@id="advancedIcon"]').click();
await page.locator('//*[@id="editAdvancedBtn"]').click();
await page.locator('//*[@id="showfile_path"]').click();
expect(await page.locator('//*[@id="showfile_path"]').isChecked()).toBeTruthy();
await page.locator('//*[@id="showmetadata"]').click();
expect(await page.locator('//*[@id="showmetadata"]').isChecked()).toBeTruthy();
await page.locator('//*[@id="keypair0"]').click();
await page.locator('//*[@id="keypair0"]').fill('testtesttesttest');
await page.locator('//*[@id="keypair100"]').click();
await page.locator('//*[@id="keypair100"]').fill('testtesttesttesttesttest');
const plusButtonLocator = page.locator('//*[@id="plusbtn0"]');
const elementCount = await plusButtonLocator.count();
if (elementCount > 0) {
await plusButtonLocator.click();
}
await page.locator('//*[@id="keypair1"]').click();
await page.locator('//*[@id="keypair1"]').fill('testtesttesttest1');
await page.locator('//*[@id="keypair101"]').click();
await page.locator('//*[@id="keypair101"]').fill('testtesttesttesttesttest1');
await page.locator('//*[@id="plusbtn1"]').click();
await page.locator('//*[@id="keypair2"]').click();
await page.locator('//*[@id="keypair2"]').fill('testtesttesttest2');
await page.locator('//*[@id="keypair102"]').click();
await page.locator('//*[@id="keypair102"]').fill('testtesttesttesttesttest2');
await page.locator('//*[@id="minusbtn1"]').click();
const keyPairVerification = page.locator('//*[@id="keypair102"]');
const elementKeyCount = await keyPairVerification.count();
if (elementKeyCount === 0) {
await page.locator('//*[@id="saveChangesBtn"]').click();
const key1 = await page.locator('//*[@id="keypair0"]').inputValue();
const value1 = await page.locator('//*[@id="keypair100"]').inputValue();
const key2 = await page.locator('//*[@id="keypair1"]').inputValue();
const value2 = await page.locator('//*[@id="keypair101"]').inputValue();
if (key1 === 'testtesttesttest' && value1 === 'testtesttesttesttesttest' && key2 === 'testtesttesttest2' && value2 === 'testtesttesttesttesttest2') {
expect(true).toBeTruthy();
}
else {
expect(false).toBeTruthy();
}
} else {
expect(false).toBeTruthy();
}
} else {
expect(false).toBeTruthy();
}
});
test("FloatComponent", async ({ page }) => {
await page.goto('http://localhost:3000/');
await page.waitForTimeout(2000);
await page.locator('//*[@id="new-project-btn"]').click();
await page.waitForTimeout(2000);
await page.getByPlaceholder('Search').click();
await page.getByPlaceholder('Search').fill('llamacpp');
await page.waitForTimeout(2000);
await page.locator('//*[@id="sideLlamaCpp"]').dragTo(page.locator('//*[@id="react-flow-id"]'));
await page.mouse.up();
await page.mouse.down();
await page.locator('//*[@id="float-input"]').click();
await page.locator('//*[@id="float-input"]').fill('3');
let value = await page.locator('//*[@id="float-input"]').inputValue();
if (value != "2") {
expect(false).toBeTruthy();
}
await page.locator('//*[@id="float-input"]').click();
await page.locator('//*[@id="float-input"]').fill('-3');
value = await page.locator('//*[@id="float-input"]').inputValue();
if (value != "-2") {
expect(false).toBeTruthy();
}
await page.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div/div[1]/div').click();
await page.locator('//*[@id="editAdvancedIcon"]').click();
await page.locator('//*[@id="showcache"]').click();
expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeTruthy();
// showecho
await page.locator('//*[@id="showecho"]').click();
expect(await page.locator('//*[@id="showecho"]').isChecked()).toBeTruthy();
// showf16_kv
await page.locator('//*[@id="showf16_kv"]').click();
expect(await page.locator('//*[@id="showf16_kv"]').isChecked()).toBeTruthy();
// showgrammar_path
await page.locator('//*[@id="showgrammar_path"]').click();
expect(await page.locator('//*[@id="showgrammar_path"]').isChecked()).toBeTruthy();
// showlast_n_tokens_size
await page.locator('//*[@id="showlast_n_tokens_size"]').click();
expect(await page.locator('//*[@id="showlast_n_tokens_size"]').isChecked()).toBeTruthy();
// showlogits_all
await page.locator('//*[@id="showlogits_all"]').click();
expect(await page.locator('//*[@id="showlogits_all"]').isChecked()).toBeTruthy();
// showlogprobs
await page.locator('//*[@id="showlogprobs"]').click();
expect(await page.locator('//*[@id="showlogprobs"]').isChecked()).toBeTruthy();
// showlora_base
await page.locator('//*[@id="showlora_base"]').click();
expect(await page.locator('//*[@id="showlora_base"]').isChecked()).toBeTruthy();
// showlora_path
await page.locator('//*[@id="showlora_path"]').click();
expect(await page.locator('//*[@id="showlora_path"]').isChecked()).toBeTruthy();
// showmax_tokens
await page.locator('//*[@id="showmax_tokens"]').click();
expect(await page.locator('//*[@id="showmax_tokens"]').isChecked()).toBeTruthy();
// showmetadata
await page.locator('//*[@id="showmetadata"]').click();
expect(await page.locator('//*[@id="showmetadata"]').isChecked()).toBeTruthy();
// showmodel_kwargs
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(await page.locator('//*[@id="showmodel_kwargs"]').isChecked()).toBeTruthy();
// showmodel_path
await page.locator('//*[@id="showmodel_path"]').click();
expect(await page.locator('//*[@id="showmodel_path"]').isChecked()).toBeFalsy();
// shown_batch
await page.locator('//*[@id="shown_batch"]').click();
expect(await page.locator('//*[@id="shown_batch"]').isChecked()).toBeTruthy();
// shown_ctx
await page.locator('//*[@id="shown_ctx"]').click();
expect(await page.locator('//*[@id="shown_ctx"]').isChecked()).toBeTruthy();
// shown_gpu_layers
await page.locator('//*[@id="shown_gpu_layers"]').click();
expect(await page.locator('//*[@id="shown_gpu_layers"]').isChecked()).toBeTruthy();
// shown_parts
await page.locator('//*[@id="shown_parts"]').click();
expect(await page.locator('//*[@id="shown_parts"]').isChecked()).toBeTruthy();
// shown_threads
await page.locator('//*[@id="shown_threads"]').click();
expect(await page.locator('//*[@id="shown_threads"]').isChecked()).toBeTruthy();
// showrepeat_penalty
await page.locator('//*[@id="showrepeat_penalty"]').click();
expect(await page.locator('//*[@id="showrepeat_penalty"]').isChecked()).toBeTruthy();
// showrope_freq_base
await page.locator('//*[@id="showrope_freq_base"]').click();
expect(await page.locator('//*[@id="showrope_freq_base"]').isChecked()).toBeTruthy();
// showrope_freq_scale
await page.locator('//*[@id="showrope_freq_scale"]').click();
expect(await page.locator('//*[@id="showrope_freq_scale"]').isChecked()).toBeTruthy();
// showseed
await page.locator('//*[@id="showseed"]').click();
expect(await page.locator('//*[@id="showseed"]').isChecked()).toBeTruthy();
// showstop
await page.locator('//*[@id="showstop"]').click();
expect(await page.locator('//*[@id="showstop"]').isChecked()).toBeTruthy();
// showstreaming
await page.locator('//*[@id="showstreaming"]').click();
expect(await page.locator('//*[@id="showstreaming"]').isChecked()).toBeTruthy();
// showsuffix
await page.locator('//*[@id="showsuffix"]').click();
expect(await page.locator('//*[@id="showsuffix"]').isChecked()).toBeTruthy();
// showtags
await page.locator('//*[@id="showtags"]').click();
expect(await page.locator('//*[@id="showtags"]').isChecked()).toBeTruthy();
// showtemperature
await page.locator('//*[@id="showtemperature"]').click();
expect(await page.locator('//*[@id="showtemperature"]').isChecked()).toBeFalsy();
// showtop_k
await page.locator('//*[@id="showtop_k"]').click();
expect(await page.locator('//*[@id="showtop_k"]').isChecked()).toBeTruthy();
// showtop_p
await page.locator('//*[@id="showtop_p"]').click();
expect(await page.locator('//*[@id="showtop_p"]').isChecked()).toBeTruthy();
// showuse_mlock
await page.locator('//*[@id="showuse_mlock"]').click();
expect(await page.locator('//*[@id="showuse_mlock"]').isChecked()).toBeTruthy();
// showuse_mmap
await page.locator('//*[@id="showuse_mmap"]').click();
expect(await page.locator('//*[@id="showuse_mmap"]').isChecked()).toBeTruthy();
// showverbose
await page.locator('//*[@id="showverbose"]').click();
expect(await page.locator('//*[@id="showverbose"]').isChecked()).toBeTruthy();
// showvocab_only
await page.locator('//*[@id="showvocab_only"]').click();
expect(await page.locator('//*[@id="showvocab_only"]').isChecked()).toBeTruthy();
await page.locator('//*[@id="showcache"]').click();
expect(await page.locator('//*[@id="showcache"]').isChecked()).toBeFalsy();
// showecho
await page.locator('//*[@id="showecho"]').click();
expect(await page.locator('//*[@id="showecho"]').isChecked()).toBeFalsy();
// showf16_kv
await page.locator('//*[@id="showf16_kv"]').click();
expect(await page.locator('//*[@id="showf16_kv"]').isChecked()).toBeFalsy();
// showgrammar_path
await page.locator('//*[@id="showgrammar_path"]').click();
expect(await page.locator('//*[@id="showgrammar_path"]').isChecked()).toBeFalsy();
// showlast_n_tokens_size
await page.locator('//*[@id="showlast_n_tokens_size"]').click();
expect(await page.locator('//*[@id="showlast_n_tokens_size"]').isChecked()).toBeFalsy();
// showlogits_all
await page.locator('//*[@id="showlogits_all"]').click();
expect(await page.locator('//*[@id="showlogits_all"]').isChecked()).toBeFalsy();
// showlogprobs
await page.locator('//*[@id="showlogprobs"]').click();
expect(await page.locator('//*[@id="showlogprobs"]').isChecked()).toBeFalsy();
// showlora_base
await page.locator('//*[@id="showlora_base"]').click();
expect(await page.locator('//*[@id="showlora_base"]').isChecked()).toBeFalsy();
// showlora_path
await page.locator('//*[@id="showlora_path"]').click();
expect(await page.locator('//*[@id="showlora_path"]').isChecked()).toBeFalsy();
// showmax_tokens
await page.locator('//*[@id="showmax_tokens"]').click();
expect(await page.locator('//*[@id="showmax_tokens"]').isChecked()).toBeFalsy();
// showmetadata
await page.locator('//*[@id="showmetadata"]').click();
expect(await page.locator('//*[@id="showmetadata"]').isChecked()).toBeFalsy();
// showmodel_kwargs
await page.locator('//*[@id="showmodel_kwargs"]').click();
expect(await page.locator('//*[@id="showmodel_kwargs"]').isChecked()).toBeFalsy();
// showmodel_path
await page.locator('//*[@id="showmodel_path"]').click();
expect(await page.locator('//*[@id="showmodel_path"]').isChecked()).toBeTruthy();
// shown_batch
await page.locator('//*[@id="shown_batch"]').click();
expect(await page.locator('//*[@id="shown_batch"]').isChecked()).toBeFalsy();
// shown_ctx
await page.locator('//*[@id="shown_ctx"]').click();
expect(await page.locator('//*[@id="shown_ctx"]').isChecked()).toBeFalsy();
// shown_gpu_layers
await page.locator('//*[@id="shown_gpu_layers"]').click();
expect(await page.locator('//*[@id="shown_gpu_layers"]').isChecked()).toBeFalsy();
// shown_parts
await page.locator('//*[@id="shown_parts"]').click();
expect(await page.locator('//*[@id="shown_parts"]').isChecked()).toBeFalsy();
// shown_threads
await page.locator('//*[@id="shown_threads"]').click();
expect(await page.locator('//*[@id="shown_threads"]').isChecked()).toBeFalsy();
// showrepeat_penalty
await page.locator('//*[@id="showrepeat_penalty"]').click();
expect(await page.locator('//*[@id="showrepeat_penalty"]').isChecked()).toBeFalsy();
// showrope_freq_base
await page.locator('//*[@id="showrope_freq_base"]').click();
expect(await page.locator('//*[@id="showrope_freq_base"]').isChecked()).toBeFalsy();
// showrope_freq_scale
await page.locator('//*[@id="showrope_freq_scale"]').click();
expect(await page.locator('//*[@id="showrope_freq_scale"]').isChecked()).toBeFalsy();
// showseed
await page.locator('//*[@id="showseed"]').click();
expect(await page.locator('//*[@id="showseed"]').isChecked()).toBeFalsy();
// showstop
await page.locator('//*[@id="showstop"]').click();
expect(await page.locator('//*[@id="showstop"]').isChecked()).toBeFalsy();
// showstreaming
await page.locator('//*[@id="showstreaming"]').click();
expect(await page.locator('//*[@id="showstreaming"]').isChecked()).toBeFalsy();
// showsuffix
await page.locator('//*[@id="showsuffix"]').click();
expect(await page.locator('//*[@id="showsuffix"]').isChecked()).toBeFalsy();
// showtags
await page.locator('//*[@id="showtags"]').click();
expect(await page.locator('//*[@id="showtags"]').isChecked()).toBeFalsy();
// showtop_k
await page.locator('//*[@id="showtop_k"]').click();
expect(await page.locator('//*[@id="showtop_k"]').isChecked()).toBeFalsy();
// showtop_p
await page.locator('//*[@id="showtop_p"]').click();
expect(await page.locator('//*[@id="showtop_p"]').isChecked()).toBeFalsy();
// showuse_mlock
await page.locator('//*[@id="showuse_mlock"]').click();
expect(await page.locator('//*[@id="showuse_mlock"]').isChecked()).toBeFalsy();
// showuse_mmap
await page.locator('//*[@id="showuse_mmap"]').click();
expect(await page.locator('//*[@id="showuse_mmap"]').isChecked()).toBeFalsy();
// showverbose
await page.locator('//*[@id="showverbose"]').click();
expect(await page.locator('//*[@id="showverbose"]').isChecked()).toBeFalsy();
// showvocab_only
await page.locator('//*[@id="showvocab_only"]').click();
expect(await page.locator('//*[@id="showvocab_only"]').isChecked()).toBeFalsy();
await page.locator('//*[@id="saveChangesBtn"]').click();
const plusButtonLocator = page.locator('//*[@id="float-input"]');
const elementCount = await plusButtonLocator.count();
if (elementCount === 0) {
expect(true).toBeTruthy();
await page.locator('//*[@id="react-flow-id"]/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div/div[1]/div').click();
await page.locator('//*[@id="editAdvancedIcon"]').click();
// showtemperature
await page.locator('//*[@id="showtemperature"]').click();
expect(await page.locator('//*[@id="showtemperature"]').isChecked()).toBeTruthy();
await page.locator('//*[@id="saveChangesBtn"]').click();
await page.locator('//*[@id="float-input"]').click();
await page.locator('//*[@id="float-input"]').fill('3');
let value = await page.locator('//*[@id="float-input"]').inputValue();
if (value != "2") {
expect(false).toBeTruthy();
}
await page.locator('//*[@id="float-input"]').click();
await page.locator('//*[@id="float-input"]').fill('-3');
value = await page.locator('//*[@id="float-input"]').inputValue();
if (value != "-2") {
expect(false).toBeTruthy();
}
}
});