No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Image disappears after printing on chrome - anyone know what's going on?

    Help
    1
    2
    225
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • R
      rconstantine last edited by

      I have this image in a vue file:

      <img
        alt="Sutter logo"
        src="../assets/SH Logo Blue.png"
        width="70px"
        height="70px"
        style="float: left; vertical-align: middle;"
      />
      

      As you can see, there is nothing special. The image exists in the specified location, and appears when the page is loaded. However, once I print (which opens a new tab plus the print dialog) via this code in the ‘methods’ section:

      onPrint () {
        this.onGenerate()
        let x = window.open()
        x.document.open()
        x.document.write('<html><head><title>' + document.title + '</title>')
        /* x.document.write('<STYLE type="text/css">\n' +
          ' </STYLE>') */
        x.document.write('</head><body >')
        x.document.write(document.getElementById('printSheet').outerHTML)
        x.document.write('</body></html>')
        x.document.close()
        x.focus()
        x.print()
        x.close()
      }
      

      While both tabs and the dialog are open, I can switch between tabs and see that all is well. It is when I close the dialog (which also closes the new tab) that the image disappears on the original tab. I must browse to another page and come back for the image to reappear.

      Any ideas why this is happening?

      1 Reply Last reply Reply Quote 0
      • R
        rconstantine last edited by

        I see that the generated HTML is this:

        <img data-v-5b338e76="" alt="Sutter logo" src="img/SH Logo Blue.png" width="70px" height="70px" style="float: left; vertical-align: middle;">
        

        It stays the same after the previously described open and close of the new tab. However, no image. Hovering over the image path in the dev tools window does show the image.

        I’m baffled and stuck!

        1 Reply Last reply Reply Quote 0
        • First post
          Last post