[Fizzlemizz]

Here's your code with some adjustments with a table of 50 entries to scroll through. See how buttonHeight (the height of a single row button) is used by FauxScrollFrame to calulate the offset of the thumb position in the bar and used in OnVerticalScroll to calculate back to an offset row in your data table for the update functions starting position.

I calculated the buttonHeight based on fitting 7 rows into the height of your ScrollFrame.

I moved the frames to UIParent so, move the back where you want.

local buttonHeight
local data = {}
for i=1, 50 do
    tinsert(data, { value = random(1, 500), display = i })
end
 
local function updateScrollFrame(self)
    local rowHeight = buttonHeight
    local totalEntries = #data
    local filled, index, row, rowData = 0
    local offset = self.Offset or 0 -- the data row to start at (caculated at OnVertivalScroll or zero)
    local rows, rowHeight = #self.buttons, self.buttons[1]:GetHeight()
    for i=1, totalEntries do -- Fill the 7 rows and show the row button
        index = offset + i
        rowData = data[index]
        if rowData then
            filled = filled + 1
            row = self.buttons[i]
            row:SetText(format("Data Row %d (%d)", rowData.display, rowData.value))
            row.index = index
            row:Show()
            if i == rows then
                break
            end
        end
    end
    if filled < rows then -- hide any non-filled button (probably not neede for a simple FauxScrollFrame but...
        for i = filled + 1, rows do
            self.buttons[i]:Hide()
        end
    end
    FauxScrollFrame_Update(self, totalEntries, rows, rowHeight) -- Update the scrollbar
end     
   
local TestScrollFrame = CreateFrame("Frame", "TestScrollFrame", UIParent, "ChatConfigBoxTemplate")
TestScrollFrame:SetSize(500, 150)
--    TestScrollFrame:SetPoint("TOPLEFT", TestInterfaceFrame, "BOTTOMLEFT")
TestScrollFrame:SetPoint("CENTER")
     
local TestScrollFrame =
        CreateFrame("ScrollFrame", "TestScrollFrame", TestScrollFrame, "FauxScrollFrameTemplate")
TestScrollFrame:SetPoint("TOPLEFT", 0, 0)
TestScrollFrame:SetPoint("BOTTOMRIGHT", -25, 0)
 
buttonHeight = TestScrollFrame:GetHeight() /  7 -- so you know the height of a button    
 
TestScrollFrame:SetScript(
        "OnVerticalScroll",
        function(self, offset) -- offset is based on the height of the scrollbar / the height of a row button see: FauxScrollFrame_Update
            self.Offset = math.floor(offset / buttonHeight) -- calulate offset back to the data row to start at
            updateScrollFrame(self)
        end
)
     
TestScrollFrame.buttons = {}
 
for index = 1, 7 do
        TestScrollFrame.buttons[index] =
            CreateFrame("Button", "$parentbtn" .. index, TestScrollFrame, "OptionsListButtonTemplate")
        local button = TestScrollFrame.buttons[index]
        button:SetID(index)
        button:SetSize(TestScrollFrame:GetWidth() - 50, buttonHeight)
        if index == 1 then
            button:SetPoint("TOPLEFT", 8, 0)
        else
            button:SetPoint("TOPLEFT", TestScrollFrame.buttons[index - 1], "BOTTOMLEFT")
        end
        button:SetScript(
            "OnClick",
            function(self, button)
                if button == "RightButton" then
                    print("Button:", self:GetID(), "Value:", data[self.index].value)
--                    updateScrollFrame()
                end
            end
        )
end
updateScrollFrame(TestScrollFrame) -- Get Started (no offset so updateScrollFrame will start a zero

As an aside, FauxScrollFrame has been deprecated but I don't expect it will go away any time soon but you may want to consider updating or replacing the Faux... methods with your own at some point.