Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

placeholderImage as a callback #5

Closed
nextend opened this issue Feb 10, 2023 · 1 comment
Closed

placeholderImage as a callback #5

nextend opened this issue Feb 10, 2023 · 1 comment
Assignees
Labels

Comments

@nextend
Copy link

nextend commented Feb 10, 2023

I would like to replace images which was unable to load for the screenshot (mostly CORS errors). I would like to generate grey area where these images are. What I would need is a callback for placeholderImage where the first parameter is the original img element.

placeholderImage: (imgElement){
    return 'Get the size of the imgElement and generate a grey image with that size.';
}

Another idea: replace the img tag in the cloned document with a simple div with styling.

@qq15725
Copy link
Owner

qq15725 commented Feb 21, 2023

Have supported

<img src="error.webp" style="width: 100px; height: 100px;">
{
  fetch: {
    placeholderImage: cloned => {
      const div = document.createElement('div')
      div.style.background = 'grey'
      div.style.display = 'inline-block'
      for (let i = cloned.style.length - 1; i >= 0; i--) {
        const name = cloned.style.item(i)
        div.style.setProperty(
          name,
          cloned.style.getPropertyValue(name),
          cloned.style.getPropertyPriority(name),
        )
      }
      cloned.parentNode?.insertBefore(div, cloned)
      return 'data:image/png;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
    },
  },
}

@qq15725 qq15725 closed this as completed Feb 21, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants