🧩 Plasmo Developers•9mo ago

Rendering issue on single page application (SPA) like youtube

I am trying to make something for youtube where i am using inline anchor. I want to inject a button on every video on youtube homepage. My code is here

import cssText from "data-text:~contents/style.css"
import type { PlasmoCSConfig, PlasmoGetInlineAnchorList } from "plasmo"
import { useEffect, useState } from "react"

export const config: PlasmoCSConfig = {
  matches: ["https://www.youtube.com/"]
}

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

export const getInlineAnchorList: PlasmoGetInlineAnchorList = async () =>
  document.querySelectorAll("a#thumbnail.ytd-thumbnail")

const HomePage = ({ anchor }) => {
  return (
    <button className="home-button-position">
      ...
    </button>
  )
}

export default HomePage

import cssText from "data-text:~contents/style.css"
import type { PlasmoCSConfig, PlasmoGetInlineAnchorList } from "plasmo"
import { useEffect, useState } from "react"

export const config: PlasmoCSConfig = {
  matches: ["https://www.youtube.com/"]
}

export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = cssText
  return style
}

export const getInlineAnchorList: PlasmoGetInlineAnchorList = async () =>
  document.querySelectorAll("a#thumbnail.ytd-thumbnail")

const HomePage = ({ anchor }) => {
  return (
    <button className="home-button-position">
      ...
    </button>
  )
}

export default HomePage

The problem is: If i land on a single video page, then i navigate to youtube home page, the buttons on every video is not rendering. But if i refresh the home page again, the buttons rendered and working fine. How to solve this issue? Please suggest me

3 Replies

AsifOP•9mo ago

@louis please help to solve this issue

kvnfo•9mo ago

Did you figure this out?

AsifOP•9mo ago

@kvnfo Custom rendering might be a solution. But in youtube, some issue happened when reached to home page

Gaming

Programming

Rendering issue on single page application (SPA) like youtube