[{"data":1,"prerenderedAt":279},["Reactive",2],{"/guides/ruby/faraday/waiting-for-a-custom-element-to-be-ready":3,"related:LIfGrwlxHS":197},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"language":10,"library":11,"property":12,"output":13,"related":14,"default":6,"body":17,"_type":192,"_id":193,"_source":194,"_file":195,"_extension":196},"/guides/ruby/faraday/waiting-for-a-custom-element-to-be-ready","faraday",false,"","Waiting for a custom element to be ready","Learn how to set up a custom javascript function that will waits for a specific condition to become true before allowing the conversion to happen. This is very interesting for waiting on charts to be generated, or custom fonts to be loaded. With PDFShift's API, this can easily be done using Ruby and the Faraday library.","Ruby","Faraday","wait_for","pdf",[15,16],"define-a-time-limit","loading-javascript-from-a-string",{"type":18,"children":19,"toc":189},"root",[20,36,48,61,73,86,91,103,138,149,154,163],{"type":21,"tag":22,"props":23,"children":24},"element","p",{},[25,28,34],{"type":26,"value":27},"text","The ",{"type":21,"tag":29,"props":30,"children":32},"code",{"className":31},[],[33],{"type":26,"value":12},{"type":26,"value":35}," parameter is one of the most powerful feature of PDFShift. It allows you to control when the document is ready to be converted to PDF.",{"type":21,"tag":22,"props":37,"children":38},{},[39,41,46],{"type":26,"value":40},"For instance, you might need the ",{"type":21,"tag":29,"props":42,"children":44},{"className":43},[],[45],{"type":26,"value":12},{"type":26,"value":47}," parameter to wait on your charts to be visible.",{"type":21,"tag":22,"props":49,"children":50},{},[51,53,59],{"type":26,"value":52},"It makes sense because from our engine point of view, all the resources are loaded so the conversion to PDF can be executed. But from your page stand point, even though everything is loaded, ",{"type":21,"tag":54,"props":55,"children":56},"em",{},[57],{"type":26,"value":58},"not everything is rendered",{"type":26,"value":60},"!",{"type":21,"tag":22,"props":62,"children":63},{},[64,66,71],{"type":26,"value":65},"So by using the ",{"type":21,"tag":29,"props":67,"children":69},{"className":68},[],[70],{"type":26,"value":12},{"type":26,"value":72}," parameter, you can tell PDFShift to wait for a specific condition to be true before allowing the conversion to happen.",{"type":21,"tag":22,"props":74,"children":75},{},[76,78,84],{"type":26,"value":77},"That property ",{"type":21,"tag":79,"props":80,"children":81},"strong",{},[82],{"type":26,"value":83},"expects a string which points to a global function",{"type":26,"value":85},".",{"type":21,"tag":22,"props":87,"children":88},{},[89],{"type":26,"value":90},"For instance, if in your HTML page, you have the following script:",{"type":21,"tag":92,"props":93,"children":98},"pre",{"className":94,"code":96,"language":97,"meta":7},[95],"language-javascript","\u003Cscript>\nfunction isPageReady() {\n    return document.getElementById('chart').clientHeight > 0;\n}\n\u003C/script>\n","javascript",[99],{"type":21,"tag":29,"props":100,"children":101},{"__ignoreMap":7},[102],{"type":26,"value":96},{"type":21,"tag":22,"props":104,"children":105},{},[106,108,113,115,121,123,128,130,136],{"type":26,"value":107},"You can set the ",{"type":21,"tag":29,"props":109,"children":111},{"className":110},[],[112],{"type":26,"value":12},{"type":26,"value":114}," parameter to ",{"type":21,"tag":29,"props":116,"children":118},{"className":117},[],[119],{"type":26,"value":120},"isPageReady",{"type":26,"value":122}," and PDFShift will wait for the ",{"type":21,"tag":29,"props":124,"children":126},{"className":125},[],[127],{"type":26,"value":120},{"type":26,"value":129}," function to return ",{"type":21,"tag":29,"props":131,"children":133},{"className":132},[],[134],{"type":26,"value":135},"true",{"type":26,"value":137}," before converting the page to PDF.",{"type":21,"tag":92,"props":139,"children":144},{"className":140,"code":142,"language":143,"meta":7},[141],"language-ruby","require 'faraday'\nrequire 'json'\n\n# You can get an API key at https://pdfshift.io\napi_key = 'sk_xxxxxxxxxxxx'\n\nparams = {\n    'source' => 'https://www.example.com',\n    'wait_for' => 'isPageReady'\n}\n\n# Create a Faraday connection\nconn = Faraday.new(url: \"https://api.pdfshift.io/v3/convert/pdf\") do |faraday|\n    faraday.request :url_encoded\n    faraday.adapter Faraday.default_adapter\nend\n\n# Make the POST request\nresponse = conn.post do |req|\n    req.headers['Content-Type'] = 'application/json'\n    req.headers['X-API-Key'] = api_key\n    req.body = params.to_json\nend\n\n# Check for successful response\nunless response.success?\n    raise \"Request failed with status code #{response.status}: #{response.body}\"\nend\n\n# write response to a file nammed \"result.pdf\"\nFile.open('result.pdf', 'wb') { |f| f.write(response.body) }\n\n# Print a success message\nputs 'The PDF document was generated and saved to result.pdf'\n","ruby",[145],{"type":21,"tag":29,"props":146,"children":147},{"__ignoreMap":7},[148],{"type":26,"value":142},{"type":21,"tag":22,"props":150,"children":151},{},[152],{"type":26,"value":153},"In case your page doesn't have the javascript function available, but you still need to wait on some elements to be rendered before continuing the conversion, you can add javascript code directly in the request and use it at the same time:",{"type":21,"tag":92,"props":155,"children":158},{"className":156,"code":157,"language":143,"meta":7},[141],"require 'faraday'\nrequire 'json'\n\n# You can get an API key at https://pdfshift.io\napi_key = 'sk_xxxxxxxxxxxx'\n\nparams = {\n    'source' => 'https://www.example.com',\n    'javascript' => 'let isFontReady = false; document.fonts.ready.then(() => isFontReady = true); function isPageReady() { return isFontReady; }',\n    'wait_for' => 'isPageReady'\n}\n\n# Create a Faraday connection\nconn = Faraday.new(url: \"https://api.pdfshift.io/v3/convert/pdf\") do |faraday|\n    faraday.request :url_encoded\n    faraday.adapter Faraday.default_adapter\nend\n\n# Make the POST request\nresponse = conn.post do |req|\n    req.headers['Content-Type'] = 'application/json'\n    req.headers['X-API-Key'] = api_key\n    req.body = params.to_json\nend\n\n# Check for successful response\nunless response.success?\n    raise \"Request failed with status code #{response.status}: #{response.body}\"\nend\n\n# write response to a file nammed \"result.pdf\"\nFile.open('result.pdf', 'wb') { |f| f.write(response.body) }\n\n# Print a success message\nputs 'The PDF document was generated and saved to result.pdf'\n",[159],{"type":21,"tag":29,"props":160,"children":161},{"__ignoreMap":7},[162],{"type":26,"value":157},{"type":21,"tag":22,"props":164,"children":165},{},[166,168,173,175,180,182,187],{"type":26,"value":167},"The above script will wait for all fonts to be ready before returning ",{"type":21,"tag":29,"props":169,"children":171},{"className":170},[],[172],{"type":26,"value":135},{"type":26,"value":174}," for the ",{"type":21,"tag":29,"props":176,"children":178},{"className":177},[],[179],{"type":26,"value":120},{"type":26,"value":181}," function.\nPDFShift will then wait for the fonts to be ready, via the ",{"type":21,"tag":29,"props":183,"children":185},{"className":184},[],[186],{"type":26,"value":120},{"type":26,"value":188},", before converting the page to PDF.",{"title":7,"searchDepth":190,"depth":190,"links":191},2,[],"markdown","content:guides:ruby:faraday:waiting-for-a-custom-element-to-be-ready.md","content","guides/ruby/faraday/waiting-for-a-custom-element-to-be-ready.md","md",[198,202,206,210,214,218,222,226,230,234,238,242,246,250,254,258,262,266,270,274,278],{"_path":199,"title":200,"language":10,"library":11,"_id":201},"/guides/ruby/faraday/accessing-secured-pages","Accessing secured pages","content:guides:ruby:faraday:accessing-secured-pages.md",{"_path":203,"title":204,"language":10,"library":11,"_id":205},"/guides/ruby/faraday/adding-a-custom-header-or-footer","Adding a custom header or footer","content:guides:ruby:faraday:adding-a-custom-header-or-footer.md",{"_path":207,"title":208,"language":10,"library":11,"_id":209},"/guides/ruby/faraday/adding-a-text-watermark","Adding a text watermark","content:guides:ruby:faraday:adding-a-text-watermark.md",{"_path":211,"title":212,"language":10,"library":11,"_id":213},"/guides/ruby/faraday/adding-an-image-watermark","Adding an image watermark","content:guides:ruby:faraday:adding-an-image-watermark.md",{"_path":215,"title":216,"language":10,"library":11,"_id":217},"/guides/ruby/faraday/avoid-conversion-on-error","Avoid the conversion on error when loading the document","content:guides:ruby:faraday:avoid-conversion-on-error.md",{"_path":219,"title":220,"language":10,"library":11,"_id":221},"/guides/ruby/faraday/convert-html-to-pdf-from-a-url","Convert an HTML document to PDF from a URL","content:guides:ruby:faraday:convert-html-to-pdf-from-a-url.md",{"_path":223,"title":224,"language":10,"library":11,"_id":225},"/guides/ruby/faraday/convert-html-to-pdf-from-raw-html","Convert an HTML document to PDF from raw HTML","content:guides:ruby:faraday:convert-html-to-pdf-from-raw-html.md",{"_path":227,"title":228,"language":10,"library":11,"_id":229},"/guides/ruby/faraday/define-a-time-limit","Define a time limit","content:guides:ruby:faraday:define-a-time-limit.md",{"_path":231,"title":232,"language":10,"library":11,"_id":233},"/guides/ruby/faraday/exporting-only-a-specific-set-of-pages","Exporting only a specific set of pages","content:guides:ruby:faraday:exporting-only-a-specific-set-of-pages.md",{"_path":235,"title":236,"language":10,"library":11,"_id":237},"/guides/ruby/faraday/generate-a-document-with-full-height","Generate a document with full height","content:guides:ruby:faraday:generate-a-document-with-full-height.md",{"_path":239,"title":240,"language":10,"library":11,"_id":241},"/guides/ruby/faraday/loading-css-from-a-string","Loading CSS from a string","content:guides:ruby:faraday:loading-css-from-a-string.md",{"_path":243,"title":244,"language":10,"library":11,"_id":245},"/guides/ruby/faraday/loading-css-from-a-url","Loading CSS from a URL","content:guides:ruby:faraday:loading-css-from-a-url.md",{"_path":247,"title":248,"language":10,"library":11,"_id":249},"/guides/ruby/faraday/loading-javascript-from-a-string","Loading Javascript from a string","content:guides:ruby:faraday:loading-javascript-from-a-string.md",{"_path":251,"title":252,"language":10,"library":11,"_id":253},"/guides/ruby/faraday/loading-javascript-from-a-url","Loading Javascript from a URL","content:guides:ruby:faraday:loading-javascript-from-a-url.md",{"_path":255,"title":256,"language":10,"library":11,"_id":257},"/guides/ruby/faraday/protecting-the-generated-pdf","Protecting the generated PDF","content:guides:ruby:faraday:protecting-the-generated-pdf.md",{"_path":259,"title":260,"language":10,"library":11,"_id":261},"/guides/ruby/faraday/receive-a-webhook-event","Receive a webhook event","content:guides:ruby:faraday:receive-a-webhook-event.md",{"_path":263,"title":264,"language":10,"library":11,"_id":265},"/guides/ruby/faraday/save-your-pdf-online-and-get-back-a-url","Save your PDF online and get back a URL","content:guides:ruby:faraday:save-your-pdf-online-and-get-back-a-url.md",{"_path":267,"title":268,"language":10,"library":11,"_id":269},"/guides/ruby/faraday/save-your-pdf-to-your-amazon-s3-bucket","Save your PDF to your Amazon S3 Bucket","content:guides:ruby:faraday:save-your-pdf-to-your-amazon-s3-bucket.md",{"_path":271,"title":272,"language":10,"library":11,"_id":273},"/guides/ruby/faraday/send-custom-http-headers","Send custom HTTP headers","content:guides:ruby:faraday:send-custom-http-headers.md",{"_path":275,"title":276,"language":10,"library":11,"_id":277},"/guides/ruby/faraday/using-cookies","Using cookies to convert HTML documents to PDF","content:guides:ruby:faraday:using-cookies.md",{"_path":4,"title":8,"language":10,"library":11,"_id":193},1785426834576]