Puppeteer Shiny test

app.R

library(shiny)

ui <- fluidPage(
  titlePanel("Puppeteer test"),
  
  verticalLayout(
      textInput(inputId = "query", label = 'Query'),
      actionButton(inputId = 'go', label = 'Go'),
      hr(),
      p(strong('On click below should read:'), ' "I like ', strong('<query>'), ' very much."'),
      uiOutput(outputId = "report")
  )
)

server <- function(input, output, session) {
  observeEvent(input$go, {
    output$report <- renderUI({
      HTML(paste("I like <strong>", input$query, "</strong> very much."))
    })
  })
}

shinyApp(ui = ui, server = server)

Puppeteer-Shiny-test.md

https://diplodata.shinyapps.io/puppeteer-test/

puppeteer-test.js

const puppeteer = require('puppeteer');

function timeout(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
};

const input_val = 'eggs';

(async() => {
    const browser = await puppeteer.launch({headless: false,})
    const page = await browser.newPage()
    await page.goto('https://diplodata.shinyapps.io/puppeteer-test/', { waitUntil: 'networkidle2' })
    await page.waitFor('#query')

    await page.evaluate((input_val) => {
      document.querySelector('#query').value = input_val;
      document.querySelector('#go').click();
    }, input_val)

    // Now I want to console.log the <strong> tag fields
    // innerText (will be 0-3 matching elements).
    // The lines below describe in non-puppeteer what
    // I need to do. But this has no effect.

    await timeout(1000)

    const strongs = await page.$$('strong')
    for(var i=0; i<strongs.length; i++) {
      console.log(strongs[i].innerText);
    }

    await timeout(1000)
    await page.screenshot({path: 'screenshot.png'}) // this renders results page ok

    browser.close();
})();