From 4348a52d656f54bf83e6e573d2f886af7073fac2 Mon Sep 17 00:00:00 2001 From: Luke Brody Date: Mon, 2 Sep 2024 11:13:56 -0700 Subject: [PATCH] Convert tests to typescript --- .../test/{article_test.js => article_test.ts} | 16 ++-- ...{comparison_test.js => comparison_test.ts} | 14 +-- .../{histogram_test.js => histogram_test.ts} | 18 ++-- react/test/{mapper_test.js => mapper_test.ts} | 7 +- react/test/{quiz_test.js => quiz_test.ts} | 92 +++++++++---------- react/test/{random_test.js => random_test.ts} | 0 react/test/{search_test.js => search_test.ts} | 0 .../{settings_test.js => settings_test.ts} | 8 +- ...{statistics_test.js => statistics_test.ts} | 2 +- ...ing_check_test.js => string_check_test.ts} | 2 - react/test/{test_utils.js => test_utils.ts} | 45 +++++---- 11 files changed, 94 insertions(+), 110 deletions(-) rename react/test/{article_test.js => article_test.ts} (97%) rename react/test/{comparison_test.js => comparison_test.ts} (93%) rename react/test/{histogram_test.js => histogram_test.ts} (91%) rename react/test/{mapper_test.js => mapper_test.ts} (93%) rename react/test/{quiz_test.js => quiz_test.ts} (85%) rename react/test/{random_test.js => random_test.ts} (100%) rename react/test/{search_test.js => search_test.ts} (100%) rename react/test/{settings_test.js => settings_test.ts} (50%) rename react/test/{statistics_test.js => statistics_test.ts} (98%) rename react/test/{string_check_test.js => string_check_test.ts} (99%) rename react/test/{test_utils.js => test_utils.ts} (70%) diff --git a/react/test/article_test.js b/react/test/article_test.ts similarity index 97% rename from react/test/article_test.js rename to react/test/article_test.ts index 405fbf3b9..ac5d2d91f 100644 --- a/react/test/article_test.js +++ b/react/test/article_test.ts @@ -3,7 +3,7 @@ import { Selector } from 'testcafe'; import { TARGET, SEARCH_FIELD, getLocation, comparison_page, check_textboxes, check_all_category_boxes, screencap, download_image -} from './test_utils.js'; +} from './test_utils'; fixture('longer article test') .page(TARGET + '/article.html?longname=California%2C+USA') @@ -99,33 +99,33 @@ test('uncheck-box-mobile', async t => { // and a checkbox, then find the checkbox await t.resizeWindow(400, 800); // refresh - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(1000); await check_textboxes(t, ['Race']); await screencap(t, "article/remove_race_initial_mobile"); // refresh - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "article/remove_race_refresh_mobile"); }) test('uncheck-box-desktop', async t => { await t.resizeWindow(1400, 800); // refresh - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(1000); await check_textboxes(t, ['Race']); await screencap(t, "article/remove_race_initial_desktop"); // refresh - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "article/remove_race_refresh_desktop"); }) test('simple', async t => { await t.resizeWindow(1400, 800); // refresh - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(1000); await check_textboxes(t, ['Simple Ordinals']); @@ -317,7 +317,7 @@ fixture('all stats test') test('california-all-stats', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await check_all_category_boxes(t); await screencap(t, "article/california-all-stats"); }); @@ -332,7 +332,7 @@ fixture('all stats test regression') test('charlotte-all-stats', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await check_all_category_boxes(t); await screencap(t, "article/charlotte-all-stats"); }); diff --git a/react/test/comparison_test.js b/react/test/comparison_test.ts similarity index 93% rename from react/test/comparison_test.js rename to react/test/comparison_test.ts index 7438cb55d..144955e19 100644 --- a/react/test/comparison_test.js +++ b/react/test/comparison_test.ts @@ -17,13 +17,13 @@ fixture('comparison test heterogenous') test('comparison-3-desktop-heterogenous', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/heterogenous-comparison-desktop"); }) test('comparison-3-mobile-heterogenous', async t => { await t.resizeWindow(400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/heterogenous-comparison-mobile"); }) @@ -35,7 +35,7 @@ fixture('comparison test homogenous (2)') test('comparison-2-mobile', async t => { await t.resizeWindow(400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/basic-comparison-2-mobile"); }) @@ -48,19 +48,19 @@ fixture('comparison test homogenous (3)') test('comparison-3-desktop', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/basic-comparison-desktop"); }) test('comparison-3-mobile', async t => { await t.resizeWindow(400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/basic-comparison-mobile"); }) test('comparison-3-download', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await download_image(t, "comparison/download-comparison"); }) @@ -124,7 +124,7 @@ fixture('plotted-across-180') test('comparison-3-plotted-across-180', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "comparison/plotted-across-180"); }); diff --git a/react/test/histogram_test.js b/react/test/histogram_test.ts similarity index 91% rename from react/test/histogram_test.js rename to react/test/histogram_test.ts index bce008bdb..9d5d0334f 100644 --- a/react/test/histogram_test.js +++ b/react/test/histogram_test.ts @@ -2,15 +2,13 @@ import { Selector } from 'testcafe'; import { TARGET, check_textboxes, comparison_page, download_histogram, download_image, download_or_check_string, screencap } from './test_utils'; -const fs = require('fs'); - export const upper_sgv = "Upper San Gabriel Valley CCD [CCD], Los Angeles County, California, USA" export const pasadena = "Pasadena CCD [CCD], Los Angeles County, California, USA" export const sw_sgv = "Southwest San Gabriel Valley CCD [CCD], Los Angeles County, California, USA" export const east_sgv = "East San Gabriel Valley CCD [CCD], Los Angeles County, California, USA" export const chicago = "Chicago city [CCD], Cook County, Illinois, USA" -async function download_or_check_histogram(t, name) { +async function download_or_check_histogram(t: TestController, name: string) { const output = await t.eval(() => { return document.getElementsByClassName("histogram-svg-panel")[0].innerHTML; }); @@ -25,7 +23,7 @@ fixture('article check and uncheck test') test("histogram-article-check-uncheck", async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); // count the number of `histogram-svg-panel` elements await t.expect(Selector('.histogram-svg-panel').count).eql(0); await t.click(Selector('.expand-toggle')); @@ -42,7 +40,7 @@ fixture('article test') test('histogram-basic-article', async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.click(Selector('.expand-toggle')); await download_or_check_histogram(t, 'histogram-basic-article'); await screencap(t, "histogram/histogram-basic-article"); @@ -51,9 +49,9 @@ test('histogram-basic-article', async t => { test('histogram-basic-article-multi', async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await check_textboxes(t, ["Other Density Metrics"]); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(1000); Selector('.expand-toggle').count.then(async count => { for (let i = 0; i < count; i++) { @@ -74,7 +72,7 @@ fixture('comparison test heterogenous') test('histogram-basic-comparison', async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); // select element with class name `expand-toggle` await t.click(Selector('.expand-toggle')); await download_or_check_histogram(t, 'histogram-basic-comparison'); @@ -90,7 +88,7 @@ fixture('comparison test heterogenous with nan') test('histogram-basic-comparison-nan', async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); // select element with class name `expand-toggle` await t.click(Selector('.expand-toggle')); await download_or_check_histogram(t, 'histogram-basic-comparison-nan'); @@ -106,7 +104,7 @@ fixture('comparison test heterogenous with nan in the middle') test('histogram-basic-comparison-nan-middle', async t => { await t.resizeWindow(800, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); // select element with class name `expand-toggle` await t.click(Selector('.expand-toggle')); await download_or_check_histogram(t, 'histogram-basic-comparison-nan-middle'); diff --git a/react/test/mapper_test.js b/react/test/mapper_test.ts similarity index 93% rename from react/test/mapper_test.js rename to react/test/mapper_test.ts index b0cd1088b..2b8286adb 100644 --- a/react/test/mapper_test.js +++ b/react/test/mapper_test.ts @@ -1,10 +1,9 @@ import { Selector } from 'testcafe'; import { TARGET, download_or_check_string, most_recent_download_path, screencap } from './test_utils'; +import fs from 'fs'; -const fs = require('fs'); - -async function check_geojson(t, path) { +async function check_geojson(t: TestController, path: string) { // download the geojson by clicking the button await t.click(Selector('button').withText('Export as GeoJSON')); await t.wait(3000); @@ -34,7 +33,7 @@ fixture('mapping-more-complex') test("mapping-more-complex", async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(5000); await screencap(t, "mapping-more-complex"); await check_geojson(t, "mapping-more-complex-geojson"); diff --git a/react/test/quiz_test.js b/react/test/quiz_test.ts similarity index 85% rename from react/test/quiz_test.js rename to react/test/quiz_test.ts index 5a809fd73..6b68a0ed0 100644 --- a/react/test/quiz_test.js +++ b/react/test/quiz_test.ts @@ -4,7 +4,7 @@ import { exec } from 'child_process'; import { writeFileSync } from 'fs'; import { promisify } from 'util'; -async function quiz_screencap(t, name) { +async function quiz_screencap(t: TestController, name: string) { await t.eval(() => { const elem = document.getElementById("quiz-timer"); if (elem) { @@ -16,13 +16,8 @@ async function quiz_screencap(t, name) { } export class ProxyPersistent extends RequestHook { - constructor() { - // only use this hook for persistent.urbanstats.org - // super("https://persistent.urbanstats.org", 443); - super() - } - async onRequest(e) { + async onRequest(e: { requestOptions: RequestMockOptions }) { if (e.requestOptions.hostname == "persistent.urbanstats.org") { e.requestOptions.hostname = "localhost"; e.requestOptions.port = 54579; @@ -32,12 +27,9 @@ export class ProxyPersistent extends RequestHook { // console.log(e) } } - - async onResponse(e) { - } } -async function run_query(query) { +async function run_query(query: string) { // dump given query to a string const command_line = `sqlite3 ../urbanstats-persistent-data/db.sqlite3 "${query}"`; const result = await promisify(exec)(command_line); @@ -52,7 +44,7 @@ function retrostat_table() { return run_query("SELECT user, week, corrects from JuxtaStatIndividualStatsRetrostat"); } -function quiz_fixture(fix_name, url, new_localstorage, sql_statements) { +function quiz_fixture(fix_name: string, url: string, new_localstorage: Record, sql_statements: string) { fixture(fix_name) .page(url) // no local storage @@ -66,7 +58,7 @@ function quiz_fixture(fix_name, url, new_localstorage, sql_statements) { await t.wait(2000); await t.eval(() => { localStorage.clear() - for (var k in new_localstorage) { + for (const k in new_localstorage) { localStorage.setItem(k, new_localstorage[k]); } }, { dependencies: { new_localstorage } }); @@ -79,21 +71,21 @@ function quiz_fixture(fix_name, url, new_localstorage, sql_statements) { } // click the kth button with id quiz-answer-button-$which -function click_button(t, which) { +function click_button(t: TestController, which: string) { return t.click(Selector("div").withAttribute("id", "quiz-answer-button-" + which)); } -async function click_buttons(t, whichs) { - for (var i = 0; i < whichs.length; i++) { - await click_button(t, whichs[i]); +async function click_buttons(t: TestController, whichs: string[]) { + for (const which of whichs) { + await click_button(t, which); await t.wait(500); } await t.wait(2000); } -function example_quiz_history(min_quiz, max_quiz, min_retro, max_retro) { - const quiz_history = {}; - for (var i = min_quiz; i <= max_quiz; i++) { +function example_quiz_history(min_quiz: number, max_quiz: number, min_retro?: number, max_retro?: number) { + const quiz_history: Record = {}; + for (let i = min_quiz; i <= max_quiz; i++) { quiz_history[i] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [true, true, true, i % 3 == 1, i % 4 == 1] @@ -106,7 +98,7 @@ function example_quiz_history(min_quiz, max_quiz, min_retro, max_retro) { } } if (min_retro && max_retro) { - for (var i = min_retro; i <= max_retro; i++) { + for (let i = min_retro; i <= max_retro; i++) { quiz_history["W" + i] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [true, true, true, i % 3 == 1, i % 4 == 1] @@ -140,11 +132,11 @@ test('quiz-clickthrough-test', async t => { await quiz_screencap(t, "quiz/clickthrough-4"); await click_button(t, "a"); await t.wait(2000); - await t.eval(() => document.getElementById("quiz-timer").remove()); + await t.eval(() => document.getElementById("quiz-timer")!.remove()); await t.wait(3000); await quiz_screencap(t, "quiz/clickthrough-5"); - let quiz_history = await t.eval(() => { - return JSON.stringify(JSON.parse(localStorage.getItem("quiz_history"))); + const quiz_history = await t.eval(() => { + return JSON.stringify(JSON.parse(localStorage.getItem("quiz_history")!)); }); await t.expect(quiz_history).eql('{"99":{"choices":["A","B","A","B","A"],"correct_pattern":[true,false,true,false,false]}}'); await t.expect(await juxtastat_table()).eql("7|99|5\n"); @@ -158,12 +150,12 @@ quiz_fixture( ); test('quiz-report-old-results', async t => { - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); - let quiz_history = await t.eval(() => { - return JSON.parse(localStorage.getItem("quiz_history")); + const quiz_history = await t.eval(() => { + return JSON.parse(localStorage.getItem("quiz_history")!); }); - let expected_quiz_history = example_quiz_history(87, 90); + const expected_quiz_history = example_quiz_history(87, 90); expected_quiz_history[99] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [true, true, true, true, false] @@ -187,12 +179,12 @@ quiz_fixture( ); test('quiz-do-not-report-stale-results', async t => { - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); - let quiz_history = await t.eval(() => { - return JSON.parse(localStorage.getItem("quiz_history")); + const quiz_history = await t.eval(() => { + return JSON.parse(localStorage.getItem("quiz_history")!); }); - let expected_quiz_history = example_quiz_history(87, 92); + const expected_quiz_history = example_quiz_history(87, 92); expected_quiz_history[99] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [true, true, true, true, false] @@ -220,7 +212,7 @@ quiz_fixture( ); test('quiz-percentage-correct', async t => { - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); await quiz_screencap(t, "quiz/percentage-correct"); await t.expect(await juxtastat_table()).eql( @@ -233,7 +225,7 @@ test('quiz-percentage-correct', async t => { localStorage.clear(); localStorage.setItem("persistent_id", "000000000000008"); }); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); await quiz_screencap(t, "quiz/percentage-correct-2"); await t.expect(await juxtastat_table()).eql( @@ -252,13 +244,13 @@ quiz_fixture( "", ); -function hex_to_dec(hex) { +function hex_to_dec(hex: string) { // https://stackoverflow.com/a/53751162/1549476 if (hex.length % 2) { hex = '0' + hex; } - var bn = BigInt('0x' + hex); + const bn = BigInt('0x' + hex); - var d = bn.toString(10); + const d = bn.toString(10); return d; } @@ -268,7 +260,7 @@ test('quiz-new-user', async t => { return localStorage.getItem("persistent_id"); }); await t.expect(user_id).notEql(null); - var user_id_int = hex_to_dec(user_id); + const user_id_int = hex_to_dec(user_id); const juxta_table = await juxtastat_table(); await t.expect(juxta_table).eql(`${user_id_int}|99|15\n`); await t.expect(await run_query("SELECT user from JuxtastatUserDomain")).eql(`${user_id_int}\n`); @@ -291,12 +283,12 @@ quiz_fixture( ); test('quiz-retrostat-regular-quiz-reporting', async t => { - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); - let quiz_history = await t.eval(() => { - return JSON.parse(localStorage.getItem("quiz_history")); + const quiz_history = await t.eval(() => { + return JSON.parse(localStorage.getItem("quiz_history")!); }); - let expected_quiz_history = example_quiz_history(87, 93, 27, 33); + const expected_quiz_history = example_quiz_history(87, 93, 27, 33); expected_quiz_history[99] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [true, true, true, true, false] @@ -309,12 +301,12 @@ test('quiz-retrostat-regular-quiz-reporting', async t => { test('quiz-retrostat-retrostat-reporting', async t => { const url = TARGET + '/quiz.html?mode=retro&date=38'; await t.navigateTo(url); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await click_buttons(t, ["a", "a", "a", "a", "a"]); - let quiz_history = await t.eval(() => { - return JSON.parse(localStorage.getItem("quiz_history")); + const quiz_history = await t.eval(() => { + return JSON.parse(localStorage.getItem("quiz_history")!); }); - let expected_quiz_history = example_quiz_history(87, 93, 27, 33); + const expected_quiz_history = example_quiz_history(87, 93, 27, 33); expected_quiz_history["W38"] = { "choices": ["A", "A", "A", "A", "A"], "correct_pattern": [false, false, true, false, true] @@ -334,7 +326,7 @@ fixture('quiz result test') }, { dependencies: { example_quiz_history } }); }); -async function check_text(t, words, emoji) { +async function check_text(t: TestController, words: string, emoji: string) { const text = await Selector("#quiz-result-summary-words").innerText; await t.expect(text).eql(words); const emoji_text = await Selector("#quiz-result-summary-emoji").innerText; @@ -343,9 +335,9 @@ async function check_text(t, words, emoji) { test('quiz-results-test', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.wait(1000); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await quiz_screencap(t, "quiz/results-page"); await check_text(t, "Excellent! 😊 4/5", "🟩🟩🟩🟩🟥"); }); @@ -386,7 +378,7 @@ fixture('several quiz results') }); test('several-quiz-results-test', async t => { - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await quiz_screencap(t, "quiz/results-page-several"); // true true true true false await check_text(t, "Excellent! 😊 4/5", "🟩🟩🟩🟩🟥"); diff --git a/react/test/random_test.js b/react/test/random_test.ts similarity index 100% rename from react/test/random_test.js rename to react/test/random_test.ts diff --git a/react/test/search_test.js b/react/test/search_test.ts similarity index 100% rename from react/test/search_test.js rename to react/test/search_test.ts diff --git a/react/test/settings_test.js b/react/test/settings_test.ts similarity index 50% rename from react/test/settings_test.js rename to react/test/settings_test.ts index 676fd49d4..b6e9e0f46 100644 --- a/react/test/settings_test.js +++ b/react/test/settings_test.ts @@ -11,9 +11,9 @@ fixture('settings regression test') .beforeEach(async t => { await t.eval(() => { localStorage.clear(); - let EG_SETTINGS = '{"related__State__County":true,"related__Native Area__Native Subdivision":true,"related__Native Statistical Area__Native Subdivision":true,"related__CSA__MSA":true,"related__MSA__County":true,"related__County__City":true,"related__CCD__City":true,"related__City__Neighborhood":true,"related__School District__Neighborhood":true,"related__ZIP__Neighborhood":false,"related__Urban Area__City":true,"related__Judicial Circuit__Judicial District":true,"related__County__County":true,"related__MSA__MSA":true,"related__CSA__CSA":true,"related__Urban Area__Urban Area":true,"related__ZIP__ZIP":true,"related__CCD__CCD":true,"related__City__City":false,"related__Neighborhood__Neighborhood":true,"related__Congressional District__Congressional District":true,"related__State House District__State House District":true,"related__State Senate District__State Senate District":true,"related__Historical Congressional District__Historical Congressional District":true,"related__Native Area__Native Area":true,"related__Native Statistical Area__Native Statistical Area":true,"related__Native Subdivision__Native Subdivision":true,"related__School District__School District":true,"related__Judicial District__Judicial District":true,"related__Judicial Circuit__Judicial Circuit":true,"related__County Cross CD__County Cross CD":true,"related__USDA County Type__USDA County Type":true,"related__Hospital Referral Region__Hospital Referral Region":true,"related__Hospital Service Area__Hospital Service Area":true,"related__Media Market__Media Market":true,"related__Continent__Continent":true,"related__Country__Country":true,"related__Subnational Region__Subnational Region":true,"related__Urban Center__Urban Center":true,"related__State__State":true,"related__5M Person Circle__5M Person Circle":true,"related__US 5M Person Circle__US 5M Person Circle":true,"related__10M Person Circle__10M Person Circle":true,"related__US 10M Person Circle__US 10M Person Circle":true,"related__20M Person Circle__20M Person Circle":true,"related__US 20M Person Circle__US 20M Person Circle":true,"related__50M Person Circle__50M Person Circle":true,"related__US 50M Person Circle__US 50M Person Circle":true,"related__100M Person Circle__100M Person Circle":true,"related__US 100M Person Circle__US 100M Person Circle":true,"related__200M Person Circle__200M Person Circle":true,"related__US 200M Person Circle__US 200M Person Circle":true,"related__500M Person Circle__500M Person Circle":true,"related__US 500M Person Circle__US 500M Person Circle":true,"related__1B Person Circle__1B Person Circle":true,"related__US 1B Person Circle__US 1B Person Circle":true,"show_statistic_main":true,"show_statistic_race":false,"show_statistic_national_origin":false,"show_statistic_education":false,"show_statistic_generation":false,"show_statistic_income":false,"show_statistic_housing":false,"show_statistic_transportation":false,"show_statistic_health":false,"show_statistic_climate":true,"show_statistic_industry":false,"show_statistic_occupation":false,"show_statistic_election":false,"show_statistic_feature":false,"show_statistic_weather":false,"show_statistic_misc":false,"show_statistic_other_densities":true,"show_statistic_2010":false,"use_imperial":true,"simple_ordinals":true,"related__ZIP__City":true}'; + const EG_SETTINGS = '{"related__State__County":true,"related__Native Area__Native Subdivision":true,"related__Native Statistical Area__Native Subdivision":true,"related__CSA__MSA":true,"related__MSA__County":true,"related__County__City":true,"related__CCD__City":true,"related__City__Neighborhood":true,"related__School District__Neighborhood":true,"related__ZIP__Neighborhood":false,"related__Urban Area__City":true,"related__Judicial Circuit__Judicial District":true,"related__County__County":true,"related__MSA__MSA":true,"related__CSA__CSA":true,"related__Urban Area__Urban Area":true,"related__ZIP__ZIP":true,"related__CCD__CCD":true,"related__City__City":false,"related__Neighborhood__Neighborhood":true,"related__Congressional District__Congressional District":true,"related__State House District__State House District":true,"related__State Senate District__State Senate District":true,"related__Historical Congressional District__Historical Congressional District":true,"related__Native Area__Native Area":true,"related__Native Statistical Area__Native Statistical Area":true,"related__Native Subdivision__Native Subdivision":true,"related__School District__School District":true,"related__Judicial District__Judicial District":true,"related__Judicial Circuit__Judicial Circuit":true,"related__County Cross CD__County Cross CD":true,"related__USDA County Type__USDA County Type":true,"related__Hospital Referral Region__Hospital Referral Region":true,"related__Hospital Service Area__Hospital Service Area":true,"related__Media Market__Media Market":true,"related__Continent__Continent":true,"related__Country__Country":true,"related__Subnational Region__Subnational Region":true,"related__Urban Center__Urban Center":true,"related__State__State":true,"related__5M Person Circle__5M Person Circle":true,"related__US 5M Person Circle__US 5M Person Circle":true,"related__10M Person Circle__10M Person Circle":true,"related__US 10M Person Circle__US 10M Person Circle":true,"related__20M Person Circle__20M Person Circle":true,"related__US 20M Person Circle__US 20M Person Circle":true,"related__50M Person Circle__50M Person Circle":true,"related__US 50M Person Circle__US 50M Person Circle":true,"related__100M Person Circle__100M Person Circle":true,"related__US 100M Person Circle__US 100M Person Circle":true,"related__200M Person Circle__200M Person Circle":true,"related__US 200M Person Circle__US 200M Person Circle":true,"related__500M Person Circle__500M Person Circle":true,"related__US 500M Person Circle__US 500M Person Circle":true,"related__1B Person Circle__1B Person Circle":true,"related__US 1B Person Circle__US 1B Person Circle":true,"show_statistic_main":true,"show_statistic_race":false,"show_statistic_national_origin":false,"show_statistic_education":false,"show_statistic_generation":false,"show_statistic_income":false,"show_statistic_housing":false,"show_statistic_transportation":false,"show_statistic_health":false,"show_statistic_climate":true,"show_statistic_industry":false,"show_statistic_occupation":false,"show_statistic_election":false,"show_statistic_feature":false,"show_statistic_weather":false,"show_statistic_misc":false,"show_statistic_other_densities":true,"show_statistic_2010":false,"use_imperial":true,"simple_ordinals":true,"related__ZIP__City":true}'; localStorage.setItem('settings', EG_SETTINGS); - location.reload(true); + location.reload(); }); }); @@ -30,7 +30,7 @@ test('check-settings-loaded', async t => { test('check-settings-loaded-desktop', async t => { // screenshot path: images/first_test.png await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await screencap(t, "settings/check-settings-loaded-desktop"); }); @@ -45,7 +45,7 @@ test('check-settings-persistent', async t => { // assert mi not in page await t.expect(Selector('span').withText('mi').exists).notOk(); // go back to San Marino - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); await t.expect(Selector('span').withText('mi').exists).notOk(); }) diff --git a/react/test/statistics_test.js b/react/test/statistics_test.ts similarity index 98% rename from react/test/statistics_test.js rename to react/test/statistics_test.ts index c78ca7dcb..cf79d62a9 100644 --- a/react/test/statistics_test.js +++ b/react/test/statistics_test.ts @@ -10,7 +10,7 @@ fixture('statistics') test('statistics-page', async t => { await t.resizeWindow(1400, 800); - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); // click the link labeled "Population" await t .click(Selector('a').withText(/^Population$/)); diff --git a/react/test/string_check_test.js b/react/test/string_check_test.ts similarity index 99% rename from react/test/string_check_test.js rename to react/test/string_check_test.ts index 3589b1894..79b8465e6 100644 --- a/react/test/string_check_test.js +++ b/react/test/string_check_test.ts @@ -1,7 +1,5 @@ import { IS_TESTING, TARGET } from "./test_utils"; - - fixture('mapping') .page(TARGET) // no local storage diff --git a/react/test/test_utils.js b/react/test/test_utils.ts similarity index 70% rename from react/test/test_utils.js rename to react/test/test_utils.ts index 3e3331671..bbf7fc9ba 100644 --- a/react/test/test_utils.js +++ b/react/test/test_utils.ts @@ -1,9 +1,8 @@ import { Selector, ClientFunction } from 'testcafe'; - -const fs = require('fs'); -const path = require('path'); - +import fs from 'fs'; +import path from 'path'; +import downloadsFolder from 'downloads-folder'; export const TARGET = process.env.URBANSTATS_TEST_TARGET ?? "http://localhost:8000" export const SEARCH_FIELD = Selector('input').withAttribute('placeholder', 'Search Urban Stats'); @@ -11,13 +10,13 @@ export const getLocation = ClientFunction(() => document.location.href); export const IS_TESTING = true; -export function comparison_page(locations) { +export function comparison_page(locations: string[]) { const params = new URLSearchParams(); params.set('longnames', JSON.stringify(locations)); return TARGET + '/comparison.html?' + params.toString(); } -export async function check_textboxes(t, txts) { +export async function check_textboxes(t: TestController, txts: string[]) { const hamburgerMenu = Selector('div').withAttribute('class', 'hamburgermenu'); if (await hamburgerMenu.exists) { await t.click(hamburgerMenu); @@ -25,7 +24,7 @@ export async function check_textboxes(t, txts) { for (const txt of txts) { const checkbox = Selector('div').withAttribute('class', 'checkbox-setting') // filter for label - .filter(node => node.querySelector('label').innerText === txt, { txt }) + .filter(node => node.querySelector('label')!.innerText === txt, { txt }) // find checkbox .find('input'); await t.click(checkbox); @@ -35,14 +34,14 @@ export async function check_textboxes(t, txts) { } } -export async function check_all_category_boxes(t) { +export async function check_all_category_boxes(t: TestController) { const hamburgerMenu = Selector('div').withAttribute('class', 'hamburgermenu'); if (await hamburgerMenu.exists) { await t.click(hamburgerMenu); } const checkboxes = Selector('div').withAttribute('class', 'checkbox-setting') .filter(node => { - const label = node.querySelector('label').innerText; + const label = node.querySelector('label')!.innerText; return ( label !== "Use Imperial Units" && label !== "Include Historical Districts" @@ -58,40 +57,39 @@ export async function check_all_category_boxes(t) { await t.click(hamburgerMenu); } // reload - await t.eval(() => location.reload(true)); + await t.eval(() => location.reload()); } -async function prep_for_image(t) { +async function prep_for_image(t: TestController) { await t.wait(1000); await t.eval(() => { // disable the leaflet map - for (const x of document.getElementsByClassName("leaflet-tile-pane")) { + for (const x of Array.from(document.getElementsByClassName("leaflet-tile-pane"))) { x.remove(); } - for (const x of document.getElementsByClassName("map-container-for-testing")) { + for (const x of Array.from(document.getElementsByClassName("map-container-for-testing"))) { const style = "border-style: solid; border-color: #abcdef"; x.setAttribute("style", style); } - document.getElementById("current-version").innerHTML = "<VERSION>"; - document.getElementById("last-updated").innerHTML = "<LAST UPDATED>"; - for (const x of document.getElementsByClassName("juxtastat-user-id")) { + document.getElementById("current-version")!.innerHTML = "<VERSION>"; + document.getElementById("last-updated")!.innerHTML = "<LAST UPDATED>"; + for (const x of Array.from(document.getElementsByClassName("juxtastat-user-id"))) { x.innerHTML = "<USER ID>"; } }); } -export async function screencap(t, name) { +export async function screencap(t: TestController, name: string) { await prep_for_image(t) return await t.takeScreenshot({ // include the browser name in the screenshot path path: name + '_' + t.browser.name + '.png', fullPage: true, - thumbnails: false }) } -export async function grab_download(t, name, button) { +export async function grab_download(t: TestController, name: string, button: Selector) { await prep_for_image(t); await t .click(button); @@ -99,19 +97,18 @@ export async function grab_download(t, name, button) { await copy_most_recent_file(t, name); } -export async function download_image(t, name) { +export async function download_image(t: TestController, name: string) { const download = Selector('img').withAttribute('src', '/screenshot.png'); await grab_download(t, name, download); } -export async function download_histogram(t, name, nth) { +export async function download_histogram(t: TestController, name: string, nth: number) { const download = Selector('img').withAttribute('src', '/download.png').nth(nth); await grab_download(t, name, download); } export function most_recent_download_path() { // get the most recent file in the downloads folder - const downloadsFolder = require('downloads-folder'); const files = fs.readdirSync(downloadsFolder()); const sorted = files.map(x => path.join(downloadsFolder(), x)).sort((a, b) => fs.statSync(b).mtimeMs - fs.statSync(a).mtimeMs); @@ -119,13 +116,13 @@ export function most_recent_download_path() { return sorted[0]; } -async function copy_most_recent_file(t, name) { +async function copy_most_recent_file(t: TestController, name: string) { // copy the file to the screenshots folder const screenshotsFolder = path.join(__dirname, '..', 'screenshots'); fs.copyFileSync(most_recent_download_path(), path.join(screenshotsFolder, name + '_' + t.browser.name + '.png')); } -export async function download_or_check_string(t, string, name) { +export async function download_or_check_string(t: TestController, string: string, name: string) { const path_to_file = path.join(__dirname, '..', "..", "tests", 'reference_strings', name + '.txt'); if (IS_TESTING) { const expected = fs.readFileSync(path_to_file, 'utf8');