# \[SOLVED\] No shadow, although castShadow and receiveShadow are true on all objects

**URL:** <https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315>\
**Category:** Questions\
**Tags:** shadows\
**Created:** [June 29, 2019, 4:05pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315 "2019-06-29T16:05:03Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![trusktr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/trusktr/32/13726_2.png) [@trusktr](https://discourse.threejs.org/u/trusktr)\
**Post date:** [June 29, 2019, 4:05pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/1 "2019-06-29T16:05:03Z")

</div>

Any ideas why it may be that, although castShadow and receiveShadow are both true on all objects, there are no shadows?

I don’t have a small example at the moment. I’ll see if I can post one, or perhaps post what happened in my case.

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [June 29, 2019, 4:24pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/2 "2019-06-29T16:24:13Z")

</div>

Does the camera frustum of the light cover your objects?

---

<div class="post-metadata">

**Author:** ![sciecode](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/sciecode/32/5623_2.png) [@sciecode](https://discourse.threejs.org/u/sciecode)\
**Post date:** [June 29, 2019, 5:35pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/3 "2019-06-29T17:35:32Z")

</div>

Have you enabled `.shadowMap` on your [WebGLRenderer](https://threejs.org/docs/#api/en/renderers/WebGLRenderer.shadowMap) ?

```
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFShadowMap;

```

[shadowMap constants](https://threejs.org/docs/#api/en/constants/Renderer)

Have you set `.castShadow = true` on your lights?

```
light.castShadow = true;

```

Have you adjusted the shadow settings on your lights?

```
light.shadow = new THREE.LightShadow( new THREE.PerspectiveCamera( 50, 1, 1200, 2500 ) );
light.shadow.bias = 0.0001;
light.shadow.mapSize.width = SHADOW_MAP_WIDTH;
light.shadow.mapSize.height = SHADOW_MAP_HEIGHT;

```

[shadowmap example](https://threejs.org/examples/?q=shadowmap#webgl_shadowmap)

---

<div class="post-metadata">

**Author:** ![trusktr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/trusktr/32/13726_2.png) [@trusktr](https://discourse.threejs.org/u/trusktr)\
**Post date:** [June 29, 2019, 6:28pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/4 "2019-06-29T18:28:14Z")

</div>

@Fyrestar @sciecode Thanks for the hints!

I had all this working before I ported the code from JS to TypeScript. In doing so, I converted properties in methods/constructor to class fields (i.e. `foo = 'bar'` outside of any method/constructor). This changed code ordering somewhere.

I checked all values mentioned above, and they are all set as expected, except for my `light.castShadow` for some reason now contains an object `{}` instead of the boolean `true`.

So I’ve gotta sort out what my new TS code is doing wrong. I’ll mark this as solved, being a problem with conversion to TS.

---

<div class="post-metadata">

**Author:** ![trusktr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/trusktr/32/13726_2.png) [@trusktr](https://discourse.threejs.org/u/trusktr)\
**Post date:** [June 29, 2019, 8:12pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/5 "2019-06-29T20:12:27Z")

</div>

@Fyrestar @sciecode Yep, it appears that simply setting `light.castShadow = {}` is what causes the issue, despite the value being truthy!

Here’s a small demo, where `castShadow` is set to `{}`.

[https://codepen.io/trusktr/pen/wLyMyv](https://codepen.io/trusktr/pen/wLyMyv)

See the lines marked with `HERE`, that look like this:

```auto
// spot_light.castShadow = true; // HERE
spot_light.castShadow = {}; // HERE

```

Good thing I’m converting to TypeScript; once I remove all the `any`s I should be able to catch issues like this at build time.

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [June 29, 2019, 8:57pm UTC](https://discourse.threejs.org/t/solved-no-shadow-although-castshadow-and-receiveshadow-are-true-on-all-objects/8315/6 "2019-06-29T20:57:43Z")

</div>

I wonder if there’s internally `light.castShadow === true` then 😸