From a2e1636d8f115a4ae03dea38f37945c75f4db655 Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:42:57 -0300 Subject: [PATCH 1/9] fix: Ensure that reactable.extras is loaded --- e2e_tests/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/e2e_tests/package.json b/e2e_tests/package.json index 2190437..2bbdf6d 100644 --- a/e2e_tests/package.json +++ b/e2e_tests/package.json @@ -3,7 +3,7 @@ "version": "0.0.1", "description": "For running cypress tests", "scripts": { - "start-test-app": "cd ../inst/examples/demo/reactable-inputs && Rscript -e 'shiny::runApp(port=8888)'", + "start-test-app": "cd ../inst/examples/demo/reactable-inputs && Rscript -e 'devtools::load_all(); shiny::runApp(port=8888)'", "e2e-test": "start-server-and-test start-test-app http://localhost:8888 'cypress run --record false'" }, "main": "index.js", From 85b162b66a9ae21771a39dc6d1e0960759633750 Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:43:52 -0300 Subject: [PATCH 2/9] feat: Adding onBlur event --- inst/assets/js/reactable-extras.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/inst/assets/js/reactable-extras.js b/inst/assets/js/reactable-extras.js index 0d51cbc..606f139 100644 --- a/inst/assets/js/reactable-extras.js +++ b/inst/assets/js/reactable-extras.js @@ -46,9 +46,13 @@ function textExtras ({ id, value, uuid, column, page, className, children }) { Shiny.setInputValue(id, { row: uuid, value: event.target.value, column: column }, { priority: 'event' }) } + const onBlur = event => { + Shiny.setInputValue(`${id}_blur`, { row: uuid, value: event.target.value, column: column }, { priority: 'event' }) + } + return React.createElement( 'input', - { onInput, className, defaultValue: value, key: uuid } + { onInput, onBlur, className, defaultValue: value, key: uuid } ) }; From 8ab4379f3aa46127007917a94840cb079ed12d4e Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:44:05 -0300 Subject: [PATCH 3/9] feat: Adding onBlur event to the example app --- inst/examples/demo/reactable-inputs/app.R | 25 +++++++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/inst/examples/demo/reactable-inputs/app.R b/inst/examples/demo/reactable-inputs/app.R index 2cf6aef..0392516 100644 --- a/inst/examples/demo/reactable-inputs/app.R +++ b/inst/examples/demo/reactable-inputs/app.R @@ -26,7 +26,8 @@ shinyApp( textOutput("button_text"), textOutput("check_text"), textOutput("dropdown_text"), - textOutput("text") + textOutput("text"), + textOutput("text_on_blur") ), server = function(input, output) { df <- MASS::Cars93[, 1:4] |> @@ -73,7 +74,8 @@ shinyApp( Model = colDef( cell = text_extra( "text", - key = "id_row" + key = "id_row", + class = "text-extra" ) ) ) @@ -142,5 +144,24 @@ shinyApp( string_list(values) ) }) + + output$text_on_blur <- renderText({ + req(input$text_blur) + values <- input$text_blur + updateReactable( + "react", + data = update_table( + df, + values$row, + values$column, + values$value, + key_column = "id_row" + ) + ) + paste0( + "Text OnBlur: ", + string_list(values) + ) + }) } ) From 9bf114b8e937a2719fdd657d927fdc139e9b28cb Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:44:19 -0300 Subject: [PATCH 4/9] tests: Adding tests for text_extra --- e2e_tests/cypress/e2e/spec.cy.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/e2e_tests/cypress/e2e/spec.cy.js b/e2e_tests/cypress/e2e/spec.cy.js index c4855d5..692c3c6 100644 --- a/e2e_tests/cypress/e2e/spec.cy.js +++ b/e2e_tests/cypress/e2e/spec.cy.js @@ -25,3 +25,16 @@ describe('Date in reactable passes values to the shiny', () => { }); }) +// test for checking text input on blur event +describe('Text Extra passes values to the Shiny App', () => { + it('TextExtra', () => { + cy.visit('http://localhost:8888'); + cy.get('.text-extra').eq(1).clear().type('new_value').should('have.value', 'new_value'); + cy.contains('Text: {row : id_2, value : new_value, column : Model}'); + // Click on body to trigger onBlur event + cy.get('body').click(); + cy.contains('Text OnBlur: {row : id_2, value : new_value, column : Model}'); + }); + }) + + \ No newline at end of file From 793778819799822dddf3d1d3300046f404deb5df Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:54:38 -0300 Subject: [PATCH 5/9] chore: phrasing --- e2e_tests/cypress/e2e/spec.cy.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/e2e_tests/cypress/e2e/spec.cy.js b/e2e_tests/cypress/e2e/spec.cy.js index 692c3c6..57d268f 100644 --- a/e2e_tests/cypress/e2e/spec.cy.js +++ b/e2e_tests/cypress/e2e/spec.cy.js @@ -25,7 +25,7 @@ describe('Date in reactable passes values to the shiny', () => { }); }) -// test for checking text input on blur event +// test for checking text input inside the reactable describe('Text Extra passes values to the Shiny App', () => { it('TextExtra', () => { cy.visit('http://localhost:8888'); From 4cd972123fe9f00455c1555fe14c37e4bad2c5f9 Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 14:59:17 -0300 Subject: [PATCH 6/9] chore: Adding screenshots and videos --- e2e_tests/.gitignore | 2 ++ 1 file changed, 2 insertions(+) diff --git a/e2e_tests/.gitignore b/e2e_tests/.gitignore index c2658d7..72748bd 100644 --- a/e2e_tests/.gitignore +++ b/e2e_tests/.gitignore @@ -1 +1,3 @@ node_modules/ +cypress/screenshots/ +cypress/videos/ From 991fa26bd1a10a58a4c315a395df8b8dd2792377 Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 15:03:38 -0300 Subject: [PATCH 7/9] chore: Adding entry --- NEWS.md | 1 + 1 file changed, 1 insertion(+) diff --git a/NEWS.md b/NEWS.md index ae8d83c..abea5a2 100644 --- a/NEWS.md +++ b/NEWS.md @@ -1,5 +1,6 @@ # reactable.extras (development version) +* `text_extra` now allows to listen to the `onBlur` event # reactable.extras 0.1.0.9000 ## Server-Side Processing From 4ab913334525cfea47790d2e31c57a3cd365b01a Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 15:03:54 -0300 Subject: [PATCH 8/9] chore: Fixing text_example, adding on_blur one --- README.md | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 2f55581..00fdcf5 100644 --- a/README.md +++ b/README.md @@ -136,7 +136,8 @@ shinyApp( textOutput("button_text"), textOutput("check_text"), textOutput("dropdown_text"), - textOutput("text") + textOutput("text_text"), + textOutput("text_on_blur") ), server = function(input, output) { output$react <- renderReactable({ @@ -209,11 +210,20 @@ shinyApp( ) }) - output$text <- renderText({ + output$text_text <- renderText({ req(input$text) values <- input$text paste0( - "Dropdown: ", + "Text: ", + string_list(values) + ) + }) + + output$text_on_blur <- renderText({ + req(input$text_blur) + values <- input$text_blur + paste0( + "Text on blur: ", string_list(values) ) }) From 9c30cc6576fdee1b674a3cc7698c9ea0d0926ec3 Mon Sep 17 00:00:00 2001 From: federiva Date: Wed, 19 Jul 2023 15:11:50 -0300 Subject: [PATCH 9/9] chore: removing empty line --- e2e_tests/cypress/e2e/spec.cy.js | 1 - 1 file changed, 1 deletion(-) diff --git a/e2e_tests/cypress/e2e/spec.cy.js b/e2e_tests/cypress/e2e/spec.cy.js index 57d268f..42dce01 100644 --- a/e2e_tests/cypress/e2e/spec.cy.js +++ b/e2e_tests/cypress/e2e/spec.cy.js @@ -36,5 +36,4 @@ describe('Text Extra passes values to the Shiny App', () => { cy.contains('Text OnBlur: {row : id_2, value : new_value, column : Model}'); }); }) - \ No newline at end of file