get var inside script tag using puppeteer

good evening everyone, I'm trying to get the array that is in this.data = [{"id_penggiat":"6f81520f-1a8b-4d1d-a7d5-defdb630818b"...] . using cheerio and puppets. I have tried my best but not getting results. help me to solver this

<script>

.......
var PenggiatField = {
    fieldid: '#penggiatField',
    data: true,
    debug: false,
    Init: function(params) {
        var field = this;
                this.data = [{"id_penggiat":"6f81520f-1a8b-4d1d-a7d5-defdb630818b","id_kerma":"9388706e-7156-4d07-bf77-cb9c6d7f30d3","id_mitra":null,"id_unit":"89c82da3-7b28-4305-82c4-347dae042847","id_unit_teknis":null,"no_pihak":"1","nm_pihak":"Institut Teknologi Sepuluh Nopember","alamat":"Kampus ITS Sukolilo Surabaya","ttd_nama":"Tri Joko Wahyu Adi, ST., MT., Ph.D.","ttd_jabatan":"Direktur","pic_nama":"","pic_jabatan":"","pic_email":null,"pelaksana":["c2c72bf4-ec6c-46dd-8be8-d9fb77a90bd6","7e42c5bb-0c44-4b93-9162-ec6fb31cd67c","902bd59e-745d-4903-b1bf-171fe6f0fb8c","c93fb75a-1065-4587-a7af-475d4256f44d","9a6592f0-ff86-401d-8021-0e9f6fc285fe","8f2d4244-d868-45e3-a906-578ce2f9f572","1f8fc06b-4707-4e11-bdc8-312f39017758"],"create_date":"2022-03-16 04:41:14.146436","id_creator":"79ce0204-5c6d-43dd-a310-8c13a557a402","last_update":"2022-03-16 04:54:25.228835","id_updater":"79ce0204-5c6d-43dd-a310-8c13a557a402","soft_delete":"0","a_lembaga":"university","id_institusi":"89c82da3-7b28-4305-82c4-347dae042847","nm_mitra":null,"nm_unit":"Institut Teknologi Sepuluh Nopember","nm_unit_teknis":null,"id_klas_mitra":"12","nm_klas_mitra":"Institusi Pendidikan","id_negara":"ID","nm_negara":"Indonesia"},{"id_penggiat":"c4c3db69-8cbb-4a8e-ae6c-544b532760c6","id_kerma":"9388706e-7156-4d07-bf77-cb9c6d7f30d3","id_mitra":"f4b81538-6442-4a19-b9f6-8581d152725d","id_unit":null,"id_unit_teknis":null,"no_pihak":"2","nm_pihak":"Sekolah Menengah Atas Negeri 1 Karas Magetan","alamat":"Jl. Karas, Punden, Kuwon, Kec. Kendal, Kabupaten Magetan, Jawa Timur 63395","ttd_nama":"Bahtiar Kholili, S.Pd., M.M.Pd.","ttd_jabatan":"Kepala Sekolah","pic_nama":"","pic_jabatan":"","pic_email":null,"pelaksana":null,"create_date":"2022-03-16 04:41:14.146436","id_creator":"79ce0204-5c6d-43dd-a310-8c13a557a402","last_update":"2022-03-16 04:54:25.228835","id_updater":"79ce0204-5c6d-43dd-a310-8c13a557a402","soft_delete":"0","a_lembaga":"mitra","id_institusi":"f4b81538-6442-4a19-b9f6-8581d152725d","nm_mitra":"Sekolah Menengah Atas Negeri 1 Karas Magetan","nm_unit":null,"nm_unit_teknis":null,"id_klas_mitra":"12","nm_klas_mitra":"Institusi Pendidikan","id_negara":"ID","nm_negara":"Indonesia"}];
        
     ........

</script>

in puppeteer the following would do the job, but it is not a general solution.

await page.goto(pageUrl)

const filteredArray = await page.$$eval('script', scripts =>
  JSON.parse(
    scripts
      .map(src => src.innerHTML)
      .filter(el => el.includes('"id_penggiat":'))[0] // selecting the desired <script>
      .split('\n')
      .filter(el => el.includes('"id_penggiat":'))[0] // selecting the exact script line within the <sript>'s innerHTML
      .replace(/this.data\W=\W|;$/gm, '')
      .trim()
  )
)
console.log(filteredArray)

what's happening?

page.$$eval collects all <script> tags into an array
we map over all scripts' innerHTML
select the one that includes the "id_penggiat": string fragment
any JavaScript scripts will be received in a huge string with innerHTML, all lines will be delimited by \n linebreaks: we can split them one-by-one
let's select the exact line within the tag that includes "id_penggiat": string fragment
clean the output string from the un-parseable parts like the variable name, this, and the ending ;. plus trim the extra spaces from the beginning of the line.
the final result can be parsed as JSON.

note: using the 1st index [0] on the Array.filter-ed values picking only the first occurrences, if you want all of them: you will need to process further.

get var inside script tag using puppeteer

1 Answers

what's happening?