Skip to content

Add tests for the data product form functions. #37

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

Open
alexandercyu wants to merge 22 commits into
base: main
Choose a base branch
from
Open

Add tests for the data product form functions. #37

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
bd062be
Update dataproduct-form.js
alexandercyu Nov 20, 2025
4c38a5b
Update .gitignore
alexandercyu Nov 21, 2025
6ddcd61
Update dataproduct-form.js
alexandercyu Nov 21, 2025
c0f030a
Create dataproduct-form.test.js
alexandercyu Nov 21, 2025
c54efb3
Create jest.config.js
alexandercyu Nov 21, 2025
4d54eb8
Create package.json
alexandercyu Nov 21, 2025
e53a027
Create package-lock.json
alexandercyu Nov 21, 2025
4c8259e
Update dataproduct-form.js
alexandercyu Dec 2, 2025
7014039
Update dataproduct-form.test.js
alexandercyu Dec 2, 2025
758112d
Update dataproduct-form.js
alexandercyu Dec 3, 2025
a33bc07
Update dataproduct-form.js
alexandercyu Dec 4, 2025
86517a0
Update dataproduct-form.js
alexandercyu Dec 8, 2025
6921d5d
Update dataproduct-form.test.js
alexandercyu Dec 8, 2025
f438722
Update dataproduct-form.test.js
alexandercyu Dec 9, 2025
02152df
Update dataproduct-form.test.js
alexandercyu Dec 9, 2025
104bb12
Update publish-dataproduct.html
alexandercyu Dec 9, 2025
8bc7bbb
Update package-lock.json
alexandercyu Dec 9, 2025
e4dd290
Update package.json
alexandercyu Dec 9, 2025
eaf0035
Update dataproduct-form.js
alexandercyu Dec 12, 2025
2732e61
Update dataproduct-form.js
alexandercyu Dec 12, 2025
080bb38
Update dataproduct-form.test.js
alexandercyu Dec 12, 2025
0441218
Update dataproduct-form.test.js
alexandercyu Dec 12, 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
2 changes: 1 addition & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -164,4 +164,4 @@ cython_debug/

# Project specific
config.toml
/tests/
/tests/node_modules
190 changes: 71 additions & 119 deletions templates/site/js/dataproduct-form.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
function initializePointInputDiv(geometryType, divID) {
var geoBboxDiv = document.getElementById(divID);
var geoContentDiv;
var geoContentDivID;
var geoAddButtonDiv;


Expand All @@ -11,24 +12,24 @@ function initializePointInputDiv(geometryType, divID) {
geoBboxDiv.classList.add("show");

if(divID.includes("_content")){
geoContentDiv = document.getElementById(divID );
geoContentDivID = divID;
geoContentDiv = document.getElementById(divID);
}
else{
geoContentDiv = document.getElementById(divID + "_content");
geoContentDivID = divID + "_content";
geoContentDiv = document.getElementById(geoContentDivID);
}

//Only create the add button for geo_multipoint, geo_linestring, geo_polygon
switch(divID){
case "geo_point":
var pointInputRow = createInputCoordinatesRow("point",1);
geoContentDiv.appendChild(pointInputRow);
addPoint("point", geoContentDivID, true);

break;

case "geo_multipoint":
geoAddButtonDiv = createAddCoordinateRowButton(geometryType, "geo_multipoint");
var multipointInputRow = createInputCoordinatesRow("multipoint", 1);
geoContentDiv.appendChild(multipointInputRow);
addPoint("multipoint", geoContentDivID, true);

if(document.getElementById("geo_" + geometryType + "_add_button_div") == null &&
document.getElementById("geo_" + geometryType + "_geojson_upload_div") == null) {
Expand All @@ -41,8 +42,7 @@ function initializePointInputDiv(geometryType, divID) {
geoAddButtonDiv = createAddCoordinateRowButton(geometryType, "geo_linestring");

for (let i = 1; i < 3; i++ ){
var linestringInputRow = createInputCoordinatesRow("linestring", i);
geoContentDiv.appendChild(linestringInputRow);
addPoint("linestring", geoContentDivID, true);
}

if(document.getElementById("geo_" + geometryType + "_add_button_div") == null &&
Expand All @@ -56,8 +56,7 @@ function initializePointInputDiv(geometryType, divID) {
geoAddButtonDiv = createAddCoordinateRowButton(geometryType, "geo_polygon");

for (let i = 1; i < 4; i++ ){
var polygonInputRow = createInputCoordinatesRow("polygon", i);
geoContentDiv.appendChild(polygonInputRow);
addPoint("polygon", geoContentDivID, true);
}

if(document.getElementById("geo_" + geometryType + "_add_button_div") == null &&
Expand Down Expand Up @@ -100,85 +99,6 @@ function initializeUploadDiv(divID){
geoContentDiv.appendChild(uploadDiv);
}


function createInputCoordinatesRow(geometryType, indexNum) {
var coordinateInputContainerDiv = document.createElement("div");
coordinateInputContainerDiv.id = geometryType + "_" + indexNum;
coordinateInputContainerDiv.classList.add("multipoint-child");

var latitudeContainer = document.createElement("div");
latitudeContainer.classList.add("latitude-child");

var label1 = document.createElement("label");
label1.id = "label_" + geometryType + "_lat_" + indexNum;
label1.classList.add("subtitle-1", "margin-input-label", "required-asterisk");
label1.innerHTML = "Latitude (Required)";
label1.setAttribute("for", "lat_" + indexNum);

var input1 = document.createElement("input");
input1.classList.add("input-textbox", "margin-input-field");
input1.setAttribute("required", "required");
input1.setAttribute("type", "number");
input1.setAttribute("min", "-90");
input1.setAttribute("max", "90");
input1.setAttribute("step", "any");
input1.setAttribute("id", geometryType + "_lat_" + indexNum);
input1.setAttribute("name", geometryType + "_lat_" + indexNum);

var longitudeContainer = document.createElement("div");
longitudeContainer.classList.add("longitude-child");

var label2 = document.createElement("label");
label2.classList.add("subtitle-1", "margin-input-label", "required-asterisk");
label2.id = "label_" + geometryType + "_lon_" + indexNum;
label2.innerHTML = "Longitude (Required)";
label2.setAttribute("for", geometryType + "_lon_" + indexNum);


var input2 = document.createElement("input");
input2.classList.add("input-textbox", "margin-input-field");
input2.setAttribute("required", "required");
input2.setAttribute("type", "number");
input2.setAttribute("min", "-180");
input2.setAttribute("max", "180");
input2.setAttribute("step", "any");
input2.setAttribute("id", geometryType + "_lon_" + indexNum);
input2.setAttribute("name", geometryType + "_lon_" + indexNum);


// Create remove button, its container and an additional container parent for positioning
var removeButtonContainerParent = document.createElement("div");
removeButtonContainerParent.classList.add("remove-button");

var removeButtonContainer = document.createElement("div");
removeButtonContainer.id = geometryType + "_remove_container_" + indexNum;
removeButtonContainer.classList.add("display-none");

var removePointButton = document.createElement("input");
removePointButton.id = geometryType + "_remove_" + indexNum;
removePointButton.setAttribute("type", "button");
removePointButton.value = "Remove Point";
removePointButton.classList.add("button-med", "d-button-text");
removePointButton.addEventListener("click", function () {
removeEntry("geo_" + geometryType + "_content", geometryType + "_" + indexNum);
});

removeButtonContainer.appendChild(removePointButton);
removeButtonContainerParent.appendChild(removeButtonContainer);


latitudeContainer.appendChild(label1);
latitudeContainer.appendChild(input1);
longitudeContainer.appendChild(label2);
longitudeContainer.appendChild(input2);
coordinateInputContainerDiv.appendChild(latitudeContainer);
coordinateInputContainerDiv.appendChild(longitudeContainer);
coordinateInputContainerDiv.appendChild(removeButtonContainerParent);

return coordinateInputContainerDiv;
}


function createAddCoordinateRowButton(geometryType, divID){
var geoAddButtonDiv = document.createElement("div");
geoAddButtonDiv.id = divID + "_add_button_div";
Expand All @@ -189,7 +109,7 @@ function createAddCoordinateRowButton(geometryType, divID){
addButton.setAttribute("type", "button");
addButton.setAttribute("value", "Add Point");
addButton.addEventListener("click", function(){
addPoint(geometryType, divID + "_content");
addPoint(geometryType, divID + "_content", false);
});

geoAddButtonDiv.appendChild(addButton);
Expand Down Expand Up @@ -256,49 +176,51 @@ function getCoordinateInputArray(geometryType){
inputArray = document.querySelectorAll(`[id^=${coordinateIDPrefix}]`);
}

return inputArray
if(inputArray.length >0){
return inputArray;
}
else{
inputArray = false;
return inputArray;
}
}

function addPoint(geometryType, divElementID) {
function addPoint(geometryType, divElementID, defaultInputRow) {
var pointInputArray = getCoordinateInputArray(geometryType);
var currentPointIndex;
var pointInputItem;
var pointInputID;
var pointIDArray;
var autindex;

if(pointInputArray.length > 1){
for (let i = 1; i < pointInputArray.length; i++){
pointInputItem = pointInputArray[i];
pointInputID = pointInputItem.id;
pointIDArray = pointInputID.split("_");
currentPointIndex = pointIDArray[2];
if(pointInputArray){
autindex = updateIndex(pointInputArray);

var currentRemoveButton = document.getElementById(geometryType + "_remove_container_" + currentPointIndex);
//If there are existing default input rows, do not show the Remove button for those default input rows.
//If any input rows are added after the default ones, show the Remove button for all rows.
if(pointInputArray.length > 0){
for (let i = 0; i < pointInputArray.length; i++){
pointInputItem = pointInputArray[i];
pointInputID = pointInputItem.id;
pointIDArray = pointInputID.split("_");
currentPointIndex = pointIDArray[2];

if(!currentRemoveButton.classList.contains("show")){
currentRemoveButton.classList.add("show");
var currentRemoveButton = document.getElementById(geometryType + "_remove_container_" + currentPointIndex);

if(defaultInputRow == false){
if(!currentRemoveButton.classList.contains("show")){
currentRemoveButton.classList.add("show");
}
}
}
}
}
else{
var firstPointInputItem = pointInputArray[0];
var currentPointID = firstPointInputItem.id;
var currentPointIDArray = currentPointID.split("_");
currentPointIndex = currentPointIDArray[2];

var firstRemoveButton = document.getElementById(geometryType + "_remove_container_" + currentPointIndex);

if(!firstRemoveButton.classList.contains("show")){
firstRemoveButton.classList.add("show");
}
autindex = 0;
}


var pointDiv = document.getElementById(divElementID);
var pointArray = getCoordinateInputArray(geometryType);

var autindex = updateIndex(pointArray);

var div_box = document.createElement("div");
div_box.classList.add("multipoint-additional-child");
div_box.id = geometryType + "_" + autindex;
Expand All @@ -314,8 +236,13 @@ function addPoint(geometryType, divElementID) {

var removeButtonDiv = document.createElement("div");
removeButtonDiv.id = geometryType + "_remove_container_" + autindex;
removeButtonDiv.classList.add("display-none", "show");

if(defaultInputRow){
removeButtonDiv.classList.add("display-none");
}
else{
removeButtonDiv.classList.add("display-none", "show");
}

var label1 = document.createElement("label");
label1.classList.add("subtitle-1", "margin-input-label", "required-asterisk");
Expand All @@ -325,7 +252,10 @@ function addPoint(geometryType, divElementID) {

var input1 = document.createElement("input");
input1.classList.add("input-textbox", "margin-input-field");
input1.setAttribute("type", "text");
input1.setAttribute("type", "number");
input1.setAttribute("min", "-90");
input1.setAttribute("max", "90");
input1.setAttribute("step", "any");
input1.setAttribute("id", geometryType + "_lat_" + autindex);
input1.setAttribute("name", geometryType + "_lat_[]"); // Make it an array input
input1.setAttribute("required", "required");
Expand All @@ -338,12 +268,16 @@ function addPoint(geometryType, divElementID) {

var input2 = document.createElement("input");
input2.classList.add("input-textbox", "margin-input-field");
input2.setAttribute("type", "text");
input2.setAttribute("type", "number");
input2.setAttribute("min", "-180");
input2.setAttribute("max", "180");
input2.setAttribute("step", "any");
input2.setAttribute("id", geometryType + "_lon_" + autindex);
input2.setAttribute("name", geometryType + "_lon_[]"); // Changed name to array input for last name
input2.setAttribute("required", "required");

var removePointButton = document.createElement("input");
removePointButton.id = geometryType + "_remove_button_" + autindex
removePointButton.setAttribute("type", "button");
removePointButton.value = "Remove Point";
removePointButton.classList.add("button-med", "d-button-text");
Expand All @@ -365,7 +299,8 @@ function addPoint(geometryType, divElementID) {
pointDiv.appendChild(div_box);
}


/*NOTE: This function is called from dropdown-publish.html.
When a Geometry dropdown item is clicked it calls this function*/
function geoPolygon2(selected_geometry) {

switch (selected_geometry) {
Expand Down Expand Up @@ -523,6 +458,7 @@ function addAuthor(divElementID) {
input3.setAttribute("name", "email_[]"); // Make it an array input

var removeAuthorButton = document.createElement("input");
removeAuthorButton.id = "author_remove_" + autindex;
removeAuthorButton.setAttribute("type", "button");
removeAuthorButton.value = "Remove Author";
removeAuthorButton.classList.add("button-med", "d-button-text");
Expand Down Expand Up @@ -623,6 +559,7 @@ function addOther(divElementID){
otherDiv.appendChild(div_box);
}

/*Used in dataproduct-onpageload.js*/
function initializeModelDropdown(dropdownID){

var dropdown = document.getElementById(dropdownID);
Expand Down Expand Up @@ -1458,3 +1395,18 @@ async function submitForm(){


}

/*For tests*/
module.exports = {
initializePointInputDiv,
initializeUploadDiv,
createAddCoordinateRowButton,
addPoint,
geoPolygon2,
addAuthor,
addModel,
addOther,
initializeModelDropdown,
removeEntry,
updateIndex
};
26 changes: 13 additions & 13 deletions templates/site/publish-dataproduct.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -193,19 +193,19 @@ <h5 class="margin-title margin-content-section"> Models</h5>
</div>
</div>

<template id="modelDropdownTemplate">
{% with %}
{% set dropdown_type = "model_dropdown" %}
{% set banner_search_dropdown_class = "banner-dropdown-list-container"%}
{% set container_id = "model_dropdown_container_template_id" %}
{% set dropdown_id = "model_dropdown_template_id" %}
{% set dropdown_button_id = "model_dropdown_button_template_id" %}
{% set dropdown_button_text_id = "model_dropdown_button_text_template_id" %}
{% set dropdown_default_UL_id = "model_dropdown_default_UL_template_id" %}
{% set dropdown_label_text = "Select one" %}
{% include "partials/dropdown-publish.html" %}
{% endwith %}
</template>
<template id="modelDropdownTemplate">
{% with %}
{% set dropdown_type = "model_dropdown" %}
{% set banner_search_dropdown_class = "banner-dropdown-list-container"%}
{% set container_id = "model_dropdown_container_template_id" %}
{% set dropdown_id = "model_dropdown_template_id" %}
{% set dropdown_button_id = "model_dropdown_button_template_id" %}
{% set dropdown_button_text_id = "model_dropdown_button_text_template_id" %}
{% set dropdown_default_UL_id = "model_dropdown_default_UL_template_id" %}
{% set dropdown_label_text = "Select one" %}
{% include "partials/dropdown-publish.html" %}
{% endwith %}
</template>

</div>

Expand Down
Loading