Back to skill

Security audit

React Best Practices

Security checks for vulnerabilities and agentic risk

Overview

This is mostly a React performance guidance skill, but it teaches a few unsafe patterns involving session cookies, inline scripts, caching, and mutable install commands.

Review before installing. The skill is not malicious, but do not blindly apply its examples: avoid logging raw session cookies, add strict XSS/CSP guardrails before using inline scripts, scope cross-request caches by tenant/user/auth context, and pin any npx or GitHub install commands to reviewed versions or commits.

Vulnerability Patterns
  • Insecure DependenciesIntroduces malicious components through unsafe dependency sources
  • Insecure Skill Coding PracticesFinds exploitable flaws such as hardcoded secrets or command injection
  • Skill Instruction HijackingAlters the agent's session goals or safety constraints when the skill loads
  • Agent Memory PoisoningWrites attacker-controlled rules into memory that affect later sessions
  • Remote Payload Retrieval and ExecutionFetches external code whose behavior can change after review
Findings (2)

T09 · Insecure Skill Coding Practices

Error
Location
rules/server-after-nonblocking.md:41
Finding

Raw Session Credential Passed to Logging Infrastructure

Content
View full analysis
{ const userAgent = (await headers()).get('user-agent') || 'unknown' const sessionCookie = (await cookies()).get('session-id')?.value || 'anonymous' logUserAction({ sessionCookie, userAgent }) }) ``` ### Technical Analysis The recommended implementation reads the complete value of the `session-id` cookie and passes it to `logUserAction`. A session cookie is normally a bearer credential: possession of a valid value may be sufficient to impersonate the associated user. Logging systems frequently have broader access controls and longer retention periods than authentication systems. They may also forward records to external analytics, observability, archival, or support platforms. Passing the raw session credential into an unspecified logging function therefore creates an unnecessary credential-disclosure path. The behavior is not required to demonstrate the documented use of Next.js `after()`. A non-secret event identifier, authenticated user identifier, or redacted correlation value would provide adequate logging context without exposing the session token. ### Attack Path 1. An application developer adopts the documented “correct” example. 2. The application reads the raw `session-id` cookie during a request. 3. `logUserAction` stores or forwards the session value to a log or analytics system. 4. An attacker obtains access to those records through a compromised logging account, overly broad employee permissions, an exported support bundle, a log injection flaw, or a breached downstream provider. 5. The attacker extracts a session value that has not expired or been revoked. 6. The attacker replays the cookie against the application and impersonates the vi ...[truncated 705 chars]
Remediation
View remediation
{ const userAgent = (await headers()).get('user-agent') || 'unknown' const requestId = crypto.randomUUID() await logUserAction({ requestId, userAgent }) }) ``` ]]>

T08 · Insecure Dependencies

Warning
Location
README.md:28
Finding

Unpinned Third-Party Code Download and Execution Through npx

Content
View full analysis
Remediation
View remediation
install react-best-practices npx svgo@ --precision=1 --multipass icon.svg ``` For GitHub installation, use an immutable reviewed commit: ```bash npx add https://github.com/wpank/ai/tree//skills/frontend/react-best-practices ``` ]]>
Vulnerability Patterns
  • Data ExfiltrationExternal Transmission, Env Variable Harvesting, File System Enumeration
  • Privilege EscalationExcessive Permissions, Sudo/Root Execution, Credential Access
  • Excessive AgencyUnrestricted Tool Access, Autonomous Decision Making, Scope Creep
  • Output HandlingUnvalidated Output Injection, Cross-Context Output, Unbounded Output
  • Rogue AgentSelf-Modification, Session Persistence
Findings (17)

Unvalidated Output Injection

High
Category
Output Handling
Confidence
97% confidence
Finding

dangerouslySetInnerHTML is a well-known dangerous sink, and here it is used to inject executable JavaScript into a <script> tag. Even though the sample currently reads only from localStorage, the pattern teaches agents to emit raw inline scripts, which can become an immediate XSS primitive if later modified to include dynamic data or copied into contexts with untrusted input.

Content

Scanner excerpt · AGENTS.md (reported line 2013)May include surrounding context.

md
{children}
      </div>
      <script
        dangerouslySetInnerHTML={{
          __html: `
            (function() {
              try {

Unvalidated Output Injection

High
Category
Output Handling
Confidence
65% confidence
Finding

Model output is used without validation or sanitization. Unvalidated output injected into downstream contexts (SQL, shell, HTML) enables injection attacks and arbitrary code execution.

Content

Scanner excerpt · rules/rendering-hydration-no-flicker.md (reported line 63)May include surrounding context.

md
{children}
      </div>
      <script
        dangerouslySetInnerHTML={{
          __html: `
            (function() {
              try {

Context-Inappropriate Capability

Medium
Category
Not specified by scanner
Confidence
88% confidence
Finding

The manifest frames this skill as performance optimization guidance, but this example introduces collection of session-id cookies and user-agent values for logging. Teaching agents to add request-data collection and audit logging goes beyond pure React/Next.js performance advice and adds privacy/security-relevant behavior not implied by the stated purpose.

Content

No source excerpt is available for this finding.

Missing User Warnings

Medium
Category
Not specified by scanner
Confidence
94% confidence
Finding

The documentation promotes inline script injection for hydration fixes without any warning about XSS, CSP, or safe encoding constraints. Because the skill is intended for agents and LLMs to generate or refactor code automatically, omission of those guardrails materially increases the chance that unsafe script construction will be reproduced in downstream applications.

Content

No source excerpt is available for this finding.

Context-Inappropriate Capability

Medium
Category
Not specified by scanner
Confidence
91% confidence
Finding

The guidance explicitly recommends injecting inline script via dangerouslySetInnerHTML as a general hydration-fix pattern. In an agent-oriented skill, this is risky because it can normalize code generation that bypasses React's safer defaults and can easily become an XSS sink if any future value interpolated into the script is user-controlled or insufficiently encoded.

Content

No source excerpt is available for this finding.

Rp1

Medium
Category
MCP Rug Pull
Confidence
87% confidence
Finding

The README instructs users to execute a remote package/tool via npx add without pinning a specific immutable version or commit. That creates a supply-chain risk: future changes to the referenced package or installer path could cause different code to run than what was originally reviewed.

Content

No source excerpt is available for this finding.

Rp1

Medium
Category
MCP Rug Pull
Confidence
91% confidence
Finding

Using npx clawhub@latest install react-best-practices pulls and executes the latest available code, which may change over time and bypass prior review. If the upstream package is compromised or a malicious release is published, users following the README may execute attacker-controlled code.

Content

No source excerpt is available for this finding.

Session Persistence

Medium
Category
Rogue Agent
Confidence
60% confidence
Finding

Skill establishes unauthorized persistence across sessions via cron jobs, startup scripts, or state files. Session persistence allows an attacker to maintain access beyond the current interaction.

Content

Scanner excerpt · README.md (reported line 44)May include surrounding context.

From your project root:

bash
mkdir -p .cursor/skills
cp -r ~/.ai-skills/skills/frontend/react-best-practices .cursor/skills/react-best-practices

Skill Enumeration

Medium
Category
Agent Snooping
Confidence
85% confidence
Finding

Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.

Content

Scanner excerpt · README.md (reported line 60)May include surrounding context.

From your project root:

bash
mkdir -p .claude/skills
cp -r ~/.ai-skills/skills/frontend/react-best-practices .claude/skills/react-best-practices

Skill Enumeration

Medium
Category
Agent Snooping
Confidence
85% confidence
Finding

Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.

Content

Scanner excerpt · README.md (reported line 67)May include surrounding context.

Claude Code (global)

bash
mkdir -p ~/.claude/skills
cp -r ~/.ai-skills/skills/frontend/react-best-practices ~/.claude/skills/react-best-practices

External Model or Provider Selection

Medium
Category
Excessive Agency
Confidence
90% confidence
Finding

Skill selects an external model or provider that may use a different account or billing plan than the operator expects. Undisclosed model switches can cause unexpected cost or quota consumption.

Content

Scanner excerpt · SKILL.md (reported line 3)May include surrounding context.

md
---
name: react-best-practices
model: standard
version: 1.0.0
description: >
  React and Next.js performance optimization guidelines from Vercel Engineering.

Rp1

Medium
Category
MCP Rug Pull
Confidence
92% confidence
Finding

The installation command uses npx clawhub@latest install react-best-practices, which pulls and executes a package at install time with a floating latest tag. This creates a supply-chain risk because future package updates could introduce malicious or compromised code that users would execute implicitly.

Content

No source excerpt is available for this finding.

Missing User Warnings

Medium
Category
Not specified by scanner
Confidence
88% confidence
Finding

The guidance explicitly recommends an inline script via dangerouslySetInnerHTML that reads from client storage and mutates the DOM, but it does not mention the security tradeoffs. While the shown snippet uses a fixed script body rather than interpolating attacker-controlled data, normalizing this pattern can weaken CSP, encourage unsafe inline scripting, and lead developers to extend it unsafely with untrusted values from localStorage or cookies.

Content

No source excerpt is available for this finding.

Rp1

Medium
Category
MCP Rug Pull
Confidence
70% confidence
Finding

npx commands without a version suffix (e.g. @1.0.0) create a rug-pull risk if the upstream server is compromised and publishes a malicious update.

Content

No source excerpt is available for this finding.

Rp1

Medium
Category
MCP Rug Pull
Confidence
70% confidence
Finding

npx commands without a version suffix (e.g. @1.0.0) create a rug-pull risk if the upstream server is compromised and publishes a malicious update.

Content

No source excerpt is available for this finding.

Missing User Warnings

Medium
Category
Not specified by scanner
Confidence
88% confidence
Finding

This markdown file explicitly recommends non-blocking logging, analytics tracking, audit logging, and notifications, and the example collects user-agent and a session-id cookie. The description does not include any warning about privacy implications, user data handling, or the need to disclose such collection when implementing the pattern.

Content

No source excerpt is available for this finding.

Missing User Warnings

Medium
Category
Not specified by scanner
Confidence
93% confidence
Finding

The guidance recommends process-local cross-request caching of user records keyed only by id and presents it as a general best practice without warning that shared in-memory caches can leak data across tenants, users, auth contexts, or permission changes if the cached object is not scoped correctly. It also omits discussion of staleness and invalidation, which can cause users to receive outdated or unauthorized data after account or authorization changes.

Content

No source excerpt is available for this finding.

Static analysis

No suspicious patterns detected.