Skip to content

Plotting Improvements #2802

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
labkey-alan merged 4 commits into from
Dec 3, 2025
Merged

Plotting Improvements #2802

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5cddeac
QueryChartDialog: update locators for new layout
labkey-alan Nov 26, 2025
53fdc77
QueryChartDialog: Add methods for setting labels
labkey-alan Dec 2, 2025
8a77c85
QueryChartDialog: Add height/width inputs
labkey-alan Dec 2, 2025
eb9da00
Fix chart settings panel locator
labkey-alan Dec 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
109 changes: 93 additions & 16 deletions src/org/labkey/test/components/react/QueryChartDialog.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Optional;

import static org.labkey.test.components.html.Input.Input;

Expand Down Expand Up @@ -44,6 +45,44 @@ public String getName()
return elementCache().nameInput.get();
}

public QueryChartDialog setTitle(String value) {
elementCache().titleInput.set(value);
elementCache().title.click(); // blur the element
return this;
}

public QueryChartDialog setSubtitle(String value)
{
elementCache().subtitleInput.set(value);
elementCache().title.click(); // blur the element
return this;
}

public QueryChartDialog setHeight(String value)
{
elementCache().heightInput.set(value);
elementCache().title.click(); // blur the element
return this;
}

public QueryChartDialog setWidth(String value)
{
elementCache().widthInput.set(value);
elementCache().title.click(); // blur the element
return this;
}

public QueryChartDialog setUseFullWidth(boolean checked)
{
elementCache().fullWidthCheckbox.set(checked);
return this;
}

public boolean getUseFullWidth()
{
return elementCache().sharedCheckbox.get();
}

public QueryChartDialog setShared(boolean checked)
{
elementCache().sharedCheckbox.set(checked);
Expand Down Expand Up @@ -131,6 +170,12 @@ public boolean isAxisScaleTypeSelected(String label, String value)
return selected;
}

public boolean isAxisScaleTypeAvailable(String label)
{
clickFieldOptions(label);
return elementCache().radioGroupWithLabel("Scale").isPresent();
}

/**
* Set the axis range to 'automatic' or 'manual' for the given axis
* @param label the axis label
Expand Down Expand Up @@ -259,6 +304,22 @@ public boolean isYAxisErrorBarOptionEnabled(String value)
return enabled;
}

public QueryChartDialog setXAxisLabel(String value)
{
clickFieldOptions("X Axis");
elementCache().xLabelInput.set(value);
Locator.tagWithText("label", "Name *").findElement(this).click(); // close the popover
return this;
}

public QueryChartDialog setYAxisLabel(String value)
{
clickFieldOptions("Y Axis");
elementCache().yLabelInput.set(value);
Locator.tagWithText("label", "Name *").findElement(this).click(); // close the popover
return this;
}

/*
groupBy is an option for bar charts only
*/
Expand Down Expand Up @@ -401,10 +462,10 @@ public QueryChartDialog setChartType(CHART_TYPE chartType)
if (getSelectedChartType().equals(chartType))
return this;

var el = elementCache().chartBuilderType.withAttribute("data-name", chartType.getChartType())
.waitForElement(this, 1500);
getWrapper().shortWait().until(ExpectedConditions.elementToBeClickable(el));
el.click();
var chartTypeDropdown = elementCache().reactSelectByLabel("Chart Type");
// ChartTypeDropdown component uses a custom option renderer
chartTypeDropdown.setOptionLocator((String type) -> Locator.byClass("chart-builder-type-option").withAttribute("data-chart-type", type));
chartTypeDropdown.select(chartType.getChartType());
WebDriverWrapper.waitFor(()-> getSelectedChartType().equals(chartType),
"The requested chart type did not become selected", 2000);

Expand All @@ -413,10 +474,11 @@ public QueryChartDialog setChartType(CHART_TYPE chartType)

public CHART_TYPE getSelectedChartType()
{
var selectedEl = elementCache().chartBuilderType.withAttributeContaining("class", "selected")
.waitForElement(this, 1500);
String dataName = selectedEl.getAttribute("data-name");
return CHART_TYPE.fromChartType(dataName);
var chartTypeDropdown = elementCache().reactSelectByLabel("Chart Type");
// The ChartTypeDropdown component has a custom value renderer, so we need to find that manually because
// chartTypeDropdown.getValue will throw an exception
WebElement selectedOption = Locator.byClass("chart-builder-type-option--value").findElement(chartTypeDropdown);
return CHART_TYPE.fromChartType(selectedOption.getAttribute("data-chart-type"));
}

public boolean isPreviewPresent()
Expand Down Expand Up @@ -529,11 +591,16 @@ protected ElementCache elementCache()

protected class ElementCache extends ModalDialog.ElementCache
{
final Input nameInput = Input(Locator.input("name"), getDriver()).findWhenNeeded(this);
final Checkbox sharedCheckbox = Checkbox.Checkbox(Locator.input("shared")).findWhenNeeded(this);
final Checkbox inheritableCheckbox = Checkbox.Checkbox(Locator.input("inheritable")).findWhenNeeded(this);

Locator.XPathLocator chartBuilderType = Locator.tagWithClass("div", "chart-builder-type");
Locator.XPathLocator settingsPanelLoc = Locator.byClass("chart-settings");
final WebElement settingsPanel = settingsPanelLoc.findWhenNeeded(this);
final Input nameInput = Input(Locator.input("name"), getDriver()).findWhenNeeded(settingsPanel);
final Input titleInput = Input(Locator.input("main-label"), getDriver()).findWhenNeeded(settingsPanel);
final Input subtitleInput = Input(Locator.input("subtitle-label"), getDriver()).findWhenNeeded(settingsPanel);
final Input heightInput = Input(Locator.input("height"), getDriver()).findWhenNeeded(settingsPanel);
final Input widthInput = Input(Locator.input("width"), getDriver()).findWhenNeeded(settingsPanel);
final Checkbox sharedCheckbox = Checkbox.Checkbox(Locator.input("shared")).findWhenNeeded(settingsPanel);
final Checkbox inheritableCheckbox = Checkbox.Checkbox(Locator.input("inheritable")).findWhenNeeded(settingsPanel);
final Checkbox fullWidthCheckbox = Checkbox.Checkbox(Locator.input("use-full-width")).findWhenNeeded(settingsPanel);

public ReactSelect reactSelectByLabel(String label)
{
Expand All @@ -543,18 +610,18 @@ public ReactSelect reactSelectByLabel(String label)
public ReactSelect reactSelectByLabel(String label, boolean allowNull)
{
Locator loc = Locator.tag("div").withChild(Locator.tagContainingText("label", label));
if (allowNull && loc.findElementOrNull(this) == null)
if (allowNull && loc.findElementOrNull(settingsPanel) == null)
return null;
else
return ReactSelect.finder(getDriver()).find(loc.waitForElement(this, 1500));
return ReactSelect.finder(getDriver()).find(loc.waitForElement(settingsPanel, 1500));
}

public WebElement fieldOptionIconByLabel(String label)
{
Locator loc = Locator.tag("div").withChild(Locator.tagContainingText("label", label));
return Locator.tagWithClass("div", "field-option-icon").descendant("span").findElementOrNull(loc.findElement(this));
}
private final Locator.XPathLocator previewContainerLoc = Locator.tag("div").withChild(Locator.tagWithText("label", "Preview"));
private final Locator.XPathLocator previewContainerLoc = Locator.tag("div").withChild(Locator.tagWithText("h4", "Preview"));
public WebElement previewContainer()
{
return previewContainerLoc.waitForElement(this, 1500);
Expand All @@ -580,6 +647,16 @@ public WebElement svg()
public RadioButton scaleManualRadio = RadioButton.RadioButton(Locator.radioButtonByNameAndValue("scaleType", "manual")).refindWhenNeeded(fieldOptionPopover);
public Input scaleRangeMinInput = Input(Locator.input("scaleMin"), getDriver()).refindWhenNeeded(fieldOptionPopover);
public Input scaleRangeMaxInput = Input(Locator.input("scaleMax"), getDriver()).refindWhenNeeded(fieldOptionPopover);
public Input yLabelInput = Input(Locator.input("y-label"), getDriver()).refindWhenNeeded(fieldOptionPopover);
public Input xLabelInput = Input(Locator.input("x-label"), getDriver()).refindWhenNeeded(fieldOptionPopover);

final Locator.XPathLocator radioGroupLoc = Locator.byClass("field-option-radio-group");

public Optional<WebElement> radioGroupWithLabel(String label)
{
Locator.XPathLocator labelLoc = Locator.tagWithText("label", label);
return radioGroupLoc.withChild(labelLoc).findOptionalElement(fieldOptionPopover);
}
}

public enum CHART_TYPE{
Expand Down