Skip to content

Commit 1a7a2f9

Browse files
rohankarn35rohankarn35
committed
Fixed Screenshot Issue
1 parent b32fb38 commit 1a7a2f9

File tree

4 files changed

+235
-11
lines changed

4 files changed

+235
-11
lines changed

‎examples/htmlfile/index.html

Lines changed: 107 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,110 @@
1-
<html>
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>IPO Alert</title>
7+
<style>
8+
body {
9+
font-family: "Poppins", sans-serif;
10+
text-align: center;
11+
background: linear-gradient(135deg, #f3f4f6, #ffffff);
12+
padding: 20px;
13+
}
14+
.container {
15+
background: white;
16+
max-width: 500px;
17+
margin: auto;
18+
padding: 25px;
19+
border-radius: 15px;
20+
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
21+
}
22+
.logo {
23+
font-size: 18px;
24+
font-weight: bold;
25+
color: #b72b67;
26+
}
27+
.title {
28+
font-size: 28px;
29+
font-weight: bold;
30+
margin-top: 10px;
31+
color: #333;
32+
}
33+
.subtitle {
34+
color: green;
35+
font-size: 18px;
36+
font-weight: bold;
37+
}
38+
.highlight {
39+
background: #ffcc00;
40+
padding: 8px 12px;
41+
font-weight: bold;
42+
border-radius: 8px;
43+
display: inline-block;
44+
margin-top: 15px;
45+
font-size: 16px;
46+
}
47+
.details {
48+
margin-top: 20px;
49+
border: 1px solid #ddd;
50+
border-radius: 10px;
51+
padding: 15px;
52+
text-align: left;
53+
background: #f9f9f9;
54+
}
55+
.details table {
56+
width: 100%;
57+
border-collapse: collapse;
58+
}
59+
.details td {
60+
padding: 10px;
61+
border-bottom: 1px solid #eee;
62+
font-size: 16px;
63+
}
64+
.details tr:last-child td {
65+
border-bottom: none;
66+
}
67+
.disclaimer {
68+
font-size: 13px;
69+
margin-top: 15px;
70+
color: #555;
71+
}
72+
.footer {
73+
margin-top: 25px;
74+
font-size: 15px;
75+
color: #007a33;
76+
font-weight: bold;
77+
}
78+
</style>
79+
</head>
280
<body>
3-
<h1>Welcome {{.Title}}, Your name is {{.User}}!</h1>
81+
<div class="container">
82+
<div class="logo">{{.CompanyName}}</div>
83+
<div class="title">{{.Title}}</div>
84+
<div class="subtitle">{{.Subtitle}}</div>
85+
86+
<div class="details">
87+
<table>
88+
<tr>
89+
<td><strong>Issue Date</strong></td>
90+
<td>{{.IssueDate}}</td>
91+
</tr>
92+
<tr>
93+
<td><strong>Closing Date</strong></td>
94+
<td>{{.ClosingDate}}</td>
95+
</tr>
96+
<tr>
97+
<td><strong>Issue Price</strong></td>
98+
<td>{{.IssuePrice}}</td>
99+
</tr>
100+
<tr>
101+
<td><strong>Sector</strong></td>
102+
<td>{{.Sector}}</td>
103+
</tr>
104+
</table>
105+
</div>
106+
107+
<div class="footer">NEPSE Navigator<br />t.me/nepsenavigator</div>
108+
</div>
4109
</body>
5110
</html>

‎examples/htmlfile/main.go

Lines changed: 125 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,17 +8,135 @@ import (
88
"github.com/rohankarn35/htmlcapture"
99
)
1010

11+
const htmlTemplate = `<!DOCTYPE html>
12+
<html lang="en">
13+
<head>
14+
<meta charset="UTF-8" />
15+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
16+
<title>IPO Alert</title>
17+
<style>
18+
body {
19+
font-family: "Poppins", sans-serif;
20+
text-align: center;
21+
background: linear-gradient(135deg, #f3f4f6, #ffffff);
22+
padding: 20px;
23+
}
24+
.container {
25+
background: white;
26+
max-width: 500px;
27+
margin: auto;
28+
padding: 25px;
29+
border-radius: 15px;
30+
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
31+
}
32+
.logo {
33+
font-size: 18px;
34+
font-weight: bold;
35+
color: #b72b67;
36+
}
37+
.title {
38+
font-size: 28px;
39+
font-weight: bold;
40+
margin-top: 10px;
41+
color: #333;
42+
}
43+
.subtitle {
44+
color: green;
45+
font-size: 18px;
46+
font-weight: bold;
47+
}
48+
.highlight {
49+
background: #ffcc00;
50+
padding: 8px 12px;
51+
font-weight: bold;
52+
border-radius: 8px;
53+
display: inline-block;
54+
margin-top: 15px;
55+
font-size: 16px;
56+
}
57+
.details {
58+
margin-top: 20px;
59+
border: 1px solid #ddd;
60+
border-radius: 10px;
61+
padding: 15px;
62+
text-align: left;
63+
background: #f9f9f9;
64+
}
65+
.details table {
66+
width: 100%;
67+
border-collapse: collapse;
68+
}
69+
.details td {
70+
padding: 10px;
71+
border-bottom: 1px solid #eee;
72+
font-size: 16px;
73+
}
74+
.details tr:last-child td {
75+
border-bottom: none;
76+
}
77+
.disclaimer {
78+
font-size: 13px;
79+
margin-top: 15px;
80+
color: #555;
81+
}
82+
.footer {
83+
margin-top: 25px;
84+
font-size: 15px;
85+
color: #007a33;
86+
font-weight: bold;
87+
}
88+
</style>
89+
</head>
90+
<body>
91+
<div class="container">
92+
<div class="logo">{{.CompanyName}}</div>
93+
<div class="title">{{.Title}}</div>
94+
<div class="subtitle">{{.Subtitle}}</div>
95+
96+
<div class="details">
97+
<table>
98+
<tr>
99+
<td><strong>Issue Date</strong></td>
100+
<td>{{.IssueDate}}</td>
101+
</tr>
102+
<tr>
103+
<td><strong>Closing Date</strong></td>
104+
<td>{{.ClosingDate}}</td>
105+
</tr>
106+
<tr>
107+
<td><strong>Issue Price</strong></td>
108+
<td>{{.IssuePrice}}</td>
109+
</tr>
110+
<tr>
111+
<td><strong>Sector</strong></td>
112+
<td>{{.Sector}}</td>
113+
</tr>
114+
</table>
115+
</div>
116+
117+
<div class="footer">NEPSE Navigator<br />t.me/nepsenavigator</div>
118+
</div>
119+
</body>
120+
</html>
121+
`
122+
11123
func main() {
12124
// Define dynamic variables
13-
variables := map[string]string{
14-
"Title": "Mr. X",
15-
"User": "John Doe",
16-
}
17125

18126
// Prepare capture options
19127
opts := htmlcapture.CaptureOptions{
20-
Input: "index.html", // Path to the HTML file
21-
Variables: variables, // Inject dynamic variables
128+
Input: htmlTemplate,
129+
Variables: map[string]string{
130+
"CompanyName": "ABC Corp",
131+
"Title": "IPO Alert",
132+
"Subtitle": "(For Equity)",
133+
134+
"IssueDate": "2023-10-01",
135+
"ClosingDate": "2023-10-10",
136+
"IssuePrice": "Rs. 100",
137+
"Sector": "Technology",
138+
},
139+
Selector: ".container",
22140
}
23141

24142
// Capture the screenshot
@@ -31,4 +149,5 @@ func main() {
31149
// Example: Save the image to a file
32150
_ = os.WriteFile("screenshot_from_file.png", imageData, 0644)
33151
}
152+
34153
}

‎examples/htmlfile/screenshot_from_file.png

8.31 KB
Loading

‎internal/browser/chromedp.go

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ func CaptureScreenshot(input string, isFile bool, viewportW, viewportH int, sele
1616
defer cancel()
1717

1818
// Set a timeout to prevent long-running sessions
19-
ctx, cancel = context.WithTimeout(ctx, 30*time.Second)
19+
ctx, cancel = context.WithTimeout(ctx, 50*time.Second)
2020
defer cancel()
2121

2222
var htmlContent string
@@ -27,7 +27,7 @@ func CaptureScreenshot(input string, isFile bool, viewportW, viewportH int, sele
2727
if isValidURL(input) {
2828
// If input is a URL, set it directly and wait for rendering
2929
targetURL = input
30-
waitForRender = chromedp.WaitReady("body") // Wait until the body is fully loaded
30+
waitForRender = chromedp.WaitReady(selector) // Wait until the body is fully loaded
3131
} else {
3232
// If input is an HTML string, use it directly
3333
htmlContent = input
@@ -52,7 +52,7 @@ func CaptureScreenshot(input string, isFile bool, viewportW, viewportH int, sele
5252

5353
// Capture the screenshot
5454
if selector != "" {
55-
tasks = append(tasks, chromedp.Screenshot(selector, &buf, chromedp.NodeVisible))
55+
tasks = append(tasks, chromedp.Screenshot(selector, &buf, chromedp.ByQuery))
5656
} else {
5757
tasks = append(tasks, chromedp.FullScreenshot(&buf, 100)) // Full-page screenshot
5858
}

0 commit comments

Comments
 (0)